Enhancement
Layout & design
Support for new CSS dynamic viewport units
Introducing new CSS viewport height and width units to provide more flexibility when designing websites for site visitors on mobile browsers.
In CSS, the viewport is the area of the browser window that is used to display the webpage. The size of the viewport can be affected by the size of the device being used to view the webpage and the zoom level. The viewport-height (VH) and viewport-width (VW) units are often used to create responsive designs that adjust the layout based on the size of the viewport.
Mobile browsers have introduced dynamic toolbars that can appear or disappear while a site visitor scrolls; this can cause fixed elements to be cut off and affect the overall quality of a site’s visitor experience.
Today, we’re excited to release new CSS viewport width-and-height units (small, large, and dynamic) to provide designers additional flexibility when designing websites for site visitors using mobile browsers and interacting with dynamic toolbars. These new CSS units will give you the ability to ensure that fixed elements are not cut off by a toolbar on mobile devices. To utilize the new CSS viewport units, just head over to the Style panel on the Designer, and also be sure to check out our latest Webflow University article to learn more.
Related updates
Get started for free
Try Webflow for as long as you like with our free Starter plan. Purchase a paid Site plan to publish, host, and unlock additional features.
Try Webflow for as long as you like with our free Starter plan. Purchase a paid Site plan to publish, host, and unlock additional features.