Investigating the new CSS viewport-relative units

The CSS Working Group has updated the CSS Values and Units Level 4 specification, introducing new viewport-relative units that offer developers more control over design behavior relative to user viewports. These units include vi and vb, which depend on the writing-mode property, and new variants like large (lv*), small (sv*), and dynamic (dv*) viewport units, each addressing different scenarios of browser UI expansion and retraction. These changes aim to improve user experience on both desktop and mobile devices by addressing issues like content shifting when browser interfaces change size, though they also require developers to balance enhanced design control with potential UX challenges. As these units become supported in browsers, developers will need to ensure they deliver a consistent and user-friendly experience, mindful of the intricacies these units introduce.