Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS CSS Basics (2014) The Box Model Padding

Posted by nelsongonzalezarango
nelsongonzalezarango
6,385 Points

What extension are you using to tell you the window size?

Towards the end of the video, Guil resizes the window and it tells him window size, and viewport size. What extension is this, and what is viewport referring to?

sizwengubane
sizwengubane
15,244 Points

bro we use media queries to design our webpage on difference screen sizes @media (max-width: 960px) { body { background: #0000FF; } } the above media query will change the background color of our body to blue ONLY when the website's width is 960px or less if the website width passes 960px ...the media query will not work

Gunhoo Yoon
Gunhoo Yoon
5,027 Points
Gunhoo Yoon
Gunhoo Yoon
5,027 Points

I think he is more curious about how to check current viewport width.

3 Answers

Gunhoo Yoon
Gunhoo Yoon
5,027 Points
Gunhoo Yoon
Gunhoo Yoon
5,027 Points

If you are using Chrome just open the developer tool and re-size window. I'm not sure about other browsers.

As far as I know, viewport is just screen size that the device renders.

Update: Firefox has built-in responsive-design mode in console. You can find it on top right side within developer tool which is 2nd icon you see before the setting.

sizwengubane
sizwengubane
15,244 Points
sizwengubane
sizwengubane
15,244 Points

Bro.. the viewport size is the screen size of the device if you want to check your browser's viewport as you change it's width this link will help http://viewportsizes.com/mine/ go to this link and on the topmost section u will see your browser's current viewport i hope my answer helped you..

emmanueldumond
emmanueldumond
6,505 Points
emmanueldumond
emmanueldumond
6,505 Points

Window resizer

emmanueldumond
emmanueldumond
6,505 Points

That the extension sorry if i respond later