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…
Educational Sensational Inspirational Foundational
A historical record of foundational web development blog posts. I've already read most of these great articles, and will of course read the few missing.…
The ideal viewport doesn’t exist
you simply do not know how users are going to visit your website or web app. Instead of making design decisions on strict, limited breakpoints, keep…
Do you know good tutorials and/or examples about dealing with responsive images that are fluid horizontaly, but with a fixed height?
Using object-fit: cover; in the CSS is easy, but how can we prevent loading many pixels that will be hidden, without using too many <source> in a <picture>?
TIL @media not (min-width: 60rem) { … } doesn't work in Safari, while it works in Chromium and Firefox.
Safari requires a media type, like all.
So here's the "right" syntax:
@media not all and (min-width: 60rem) { … }
💡 CSS idea of the day:
Zach Leatherman
:root {
--full-height: 100vh;
}
@supports(height: 100dvh) {
:root {
--full-height: 100dvh;
}
}
Clever? Stupid? Old?