11 ms·
> There are really 2 use cases: mobile portrait mode and everything else I mostly agree. I am currently tasked with building a brand new mobile/desktop web app
by bob1029 4y ago
> There are really 2 use cases: mobile portrait mode and everything else
I mostly agree. I am currently tasked with building a brand new mobile/desktop web app from scratch, and this is the path I have chosen as well.
The breakpoint I am working with right now is 980px. Seems to be a goldilocks setting in 2022.
- moron4hire 4y agoI've gotten good results from using just the pointer media query, since that is generally the more pressing issue (how easy is it for users to hit buttons): https://developer.mozilla.org/en-US/docs/Web/CSS/@media/pointer https://developer.mozilla.org/en-US/docs/Web/CSS/@media/poin...
- bob1029 4y agoThis is interesting. I may blend this query in with the width query I am currently using. The width query is to trigger a layout collapse, but I can see where the pointer query could be useful for controlling things like button and input sizes dynamically.
- rkeene2 4y agoYeah, this kind of check is useful since I sometimes dock my phone and use it with a keyboard, mouse, and 27 inch display and sites and native apps that expect the mouse cursor to be a very precise finger are annoying to use. Selecting text is particularly annoying.
- aimor 4y agoI use width measured in characters for a breakpoint. I still wish there was a media feature to declare "mobile phone".
- ansgri 4y ago980 > 1920 / 2, making split-screen view on a typical laptop very annoying. What’s the reasoning behind this number. Like, make it 900 and drastically more cases are covered.
- bob1029 4y agoI really appreciate this comment. You drew my attention to the fact that I had been testing on a 1440p monitor, so this behavior wasn't present in my initial testing (side-by-side with dev tools). I agree that 900 is a better breakpoint for the more typical desktop/laptop screen resolutions.