💡 CSS idea of the day:
:root {
--full-height: 100vh;
}
@supports(height: 100dvh) {
:root {
--full-height: 100dvh;
}
}Clever? Stupid? Old?
The Large, Small, and Dynamic Viewports
Bramus shows how the situation might finally improve for viewport height CSS units, more than 6 years after I reported the unreliable 100vh value as a bug to webkit, and webkit replied it was "intended".
A Bashful Button Worth 8 Million Dollars
6 years ago I reported a bug about 100vh being larger than the viewport height in Safari. It was "intentional" according to webkit/Safari team, and other browsers followed… 🤦♂️
4329 is a long discussion about how people are really, really, REALLY unhappy how on mobile the viewport units don't represent the size of the viewport — @fantasai https://github.com/w3c/csswg-drafts/issues/4329#issuecomment-814281379
😅
6 years later, this is still my most read article…
Viewport height is taller than the visible part of the document in some mobile browsers
When trying to use a 100vh CSS value to build a new interface for a game that would use the full viewport, I discovered that this full height value meant the bottom of the game interface was partialy hidden behind the browser buttons bar or below the "fold" of some mobile browsers.
Bramus Van Damme
Jason Grigsby