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 Unused CSS Stages Media Queries Device-Specific Media Queries: Part 1

Chris Shaffer
Chris Shaffer
12,030 Points

Chrome Viewport Tools

I wanted to share this for those who may not have seen it before.

I was doing this lesson and wanted to find a tool that would work well for testing viewport sizes and recognize my browser as a smaller device.

Chrome now has a nifty tool built in to do just this using the Developer Tools.

This link explains how to access this: http://www.hongkiat.com/blog/chrome-viewport/

I also found this nifty little Chrome extension that works pretty well, too, though it's limited to using a URL so you can't adjust local files unless you're running them from your own server.

https://chrome.google.com/webstore/detail/dimensions-legacy/hdmihohhdcbejdkidbfijmfehjbnmifk?hl=en

1 Answer

Devin Cooper
Devin Cooper
8,352 Points

Thanks for the heads up Chris!

Another similar tool I use in Chrome for testing responsiveness is "Window Resizer". Download it here: https://chrome.google.com/webstore/detail/window-resizer/kkelicaakdanhinjdeammmilcgefonfh

Chris Shaffer
Chris Shaffer
12,030 Points

Nice. I think that's what Guil uses on this exercise, too.