3 ms·
Nice catch. I wonder if there is tooling out there that can examine a document's CSS files, and smoothly resize a web browser between the document's media query
by tomjakubowski 10y ago
Nice catch. I wonder if there is tooling out there that can examine a document's CSS files, and smoothly resize a web browser between the document's media query "break points" as it renders, so designers/developers can more easily find these bugs that happen with browser sizes near those break points.
- ars 10y agoWhy can't you literally just resize your actual browser and watch what it does? That's what I do when I'm making a responsive website - I'm constantly changing browser width to make sure it works at all sizes. It's not enough to just check for the @media sizes - you also need to check the sizes in between in case boxes get shrunk too small to fit their content.
- tracker1 10y ago+1, always do this... I tend to find that certain design constraints need breakpoints that don't match the atypical @media breaks that are used in Bootstrap and the like... just by nature of what's being placed... It's best to actually exercise and practice where you're breaking things down. Also, since I tend to use React/Redux lately, I inject size/scroll into my state and use that as a basis for those decisions in controls as often as I'll use CSS/JSS alone anymore.
- Domenic_S 10y agoI think that's called "holding alt while you resize the browser".
- dceddia 10y agoOh snap! How have I never known about this? Works just like holding Alt while resizing objects in Sketch or Photoshop. Very handy.
- manigandham 10y agoThe tooling is already available. Either resize your actual browser window or use the devtools device emulator. Chrome has extensive support for this.