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

Development Tools

Sebastian de Rementeria
Sebastian de Rementeria
2,386 Points

Responsive Testing in Crome Dev Tools

Hi Everyone,

I've created a gallery using css and added Javascript Lightbox. I've made it responsive using @media screen and. It drops from four to three to two and down one column. It seems to work fine and looks cool. However, when I test it through Crome Dev Tools it only appears with the four thumbnails, it doest appear responsive at all.

Is my gallery REALLY responsive?

3 Answers

andren
andren
28,558 Points

Do you have the viewport meta tag in your html? Something along these lines:

<meta name="viewport" content="width=device-width, initial-scale=1">

If not you should place it within the head element of your page. In my experience the responsive design feature in the chrome dev tools only works when it is present. And having it present tends to improve how mobile browsers render your page.

Jesus Mendoza
Jesus Mendoza
23,289 Points

Hey Sebastian,

I use a tool called "Window Resizer" for chrome, give it a try!

If it doesn't work you might have done something wrong in your code, try pasting it here!

Sebastian de Rementeria
Sebastian de Rementeria
2,386 Points

Thanks Andren! Yes, I hadn't added it to that page.