Choosing the Right Viewport Unit in CSS: vh, svh, lvh and dvh Explained
A deep dive into viewport units in CSS, exploring vh, svh, lvh, dvh, and how to choose the right one for your layouts.

With more than 20 years in web development, I focus on frontend systems that stay maintainable and scalable over time.
I specialize in frontend development with React, building clear component structures, reliable CSS, and user interfaces that are easy to understand and extend. Code quality and clarity matter to me – because poorly structured frontends slow teams down just as much as bad backend architecture.
When starting from scratch, Next.js is my go-to framework. I’m comfortable with different styling approaches, from CSS Modules to utility-first setups like Tailwind and component scaffolding approaches such as shadcn/ui.
Over two decades of building for the web taught me what lasts, what breaks at scale, and how frontend systems need to evolve as products and teams grow.
A deep dive into viewport units in CSS, exploring vh, svh, lvh, dvh, and how to choose the right one for your layouts.