CSS Tip: Use the Correct Viewport Size
●
Permalink
●
suggest edit
Last night, I ran into an issue with a container that was not expanding to full height. I could not understand why it wasn’t expanding properly. After tearing it down and rebuilding it by copying the CSS rules from my original, I noticed the height property. I had set the value for height to 100vw. Sometimes, when looking at something so simple in DevTools, it’s very easy to overlook typos. Be sure to double-check your values. In case you’re not sure what 100vw equates to, this is 100% of the viewport width, not height. I corrected the value to 100vh and of course it is now working as expected.
Happy Cinco de Mayo everyone!