CSS Unused CSS Stages Media Queries Device-Specific Media Queries: Part 1

Todd Squitieri
Todd Squitieri
8,001 Points

Where to Find Exact percentages for Screen Width

In the CSS lesson on media queries, Guil produces some pretty long percentages to make the website as fluid and responsive as possible. I want to know where I can obtain these exact numbers to make my own website as fluid and responsive as possible. I don't have some devices, like a tablet or a macbook, so I can only make guesses right now as to how my webpage will appear to others using said devices that I don't have.

Any information would be much appreciated.

Thanks in advance.

3 Answers

Samuel Rueby
Samuel Rueby
22,550 Points

The idea of media queries is that specific devices don't matter. So, you shouldn't need these devices. Resize your browser manually. Though, I have been playing around with the new features in Chrome's dev tools that allow you to simulate what your pages look like on mobile devices: https://developer.chrome.com/devtools/docs/mobile-emulation

In other words, his numbers aren't exact. He's basing them on something, but they're his judgement. If there were numbers we should all be using we would know them.

Todd Squitieri
Todd Squitieri
8,001 Points

Samuel,

Sorry for the delayed reply. I just wanted to thank you for your thoughtful response and the link! This has helped me a lot.

Thank you so much.

Sincerely,

Todd

Juan Aviles
Juan Aviles
12,795 Points

In an earlier lesson with Nick, he talked about how he got those long percentage values. I thought Guil would also hit on how he made the calculations, but that didn't seem to be the case. I wish I could remember what Nick said, but I may have to go back through his course and find it when I need it.