Support of vw, vh, vmin and vmax

Hello everyone, first at all, I’d like to share a feature of Chrome that’s very useful for testing your websites (you probably already know it). If you right click on a web page a select “inspect element”, and then click on the phone icon on the left, you can render your website with different media queries, from mobile to desktop.

I was checking how my website (http://dariostefanutto.com/journal) looks on an iMac, and I realized that the screen is so huge that everything looks much smaller. A way to fix this would be designing only with proportions, for both divs and type. So I’m wondering if Webflow is planning to support values for viewport sized typography. Vh is already supported, but not vw, vmin and vmax.

In css-tricks.com I found the explaination for these values:
1vw = 1% of viewport width
1vh = 1% of viewport height
1vmin = 1vw or 1vh, whichever is smaller
1vmax = 1vw or 1vh, whichever is larger

Thanks!

Hey @Dario try pasting in 100 vh into the height field in Webflow. It should work. :smile:

1 Like

It does! But vw, vmin and vmax don’t. You have to build a long workaround with jQuery to achieve that. It would be wonderful if it is going to be implemented.

Why is it you can type in VH but not select it from a list ?

I was looking at this about a week ago. Interesting that others are looking at the same thing.

Ideally we’d show all the current supported formats (including ems) in those unit dropdowns. We want to polish that up but just haven’t had the chance. It’s on our to-do list!

3 Likes

+1 for support of vmin and vmax

1 Like

does anyone know if vmin and vmax is now supported?

Vmin and Vmax are not yet supported in Webflow as of today.

awesome! seriously this is what makes you guys awesome! great support from you and the amazing community! thanks for all you do :sunglasses: