3 ms·
I remember learning how to get my site to display decently on different screen sizes. I got an abridged history of past attempts: "handheld" CSS media type, the
by aimor 6y ago
I remember learning how to get my site to display decently on different screen sizes. I got an abridged history of past attempts: "handheld" CSS media type, then media features "device-height/width, resolution, pointer, orientation, aspect ratio", some people try to use the User Agent, others target a huge list of specific device resolutions, webkit has a device pixel ratio?, it all seemed like a huge mess.
Then it turns out the solution isn't CSS it's the HTML "meta" tag:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
On top of that I use media queries to respond to the font size.
@media (max-width: 35rem)
I'd love to know if there's a better way, but this has been pretty good for me.
- ficklepickle 6y agoNope, you pretty much nailed it. That meta tag is crucial. If you were mobile-first, you'd use min-width media queries rather than max-width.