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 trialCarlos Diaz
Courses Plus Student 9,006 PointsMedia queries break point
HI guys I hope you all are doing great.
Listen, I was doing some research because I need some specific media queries breakpoints to use in foundation and I don't get it yet :(
for example.
I want to display some divs in one way only for320W - 480H but the same divs have different attributes for only 360W - 640H and only 480W - 800H
Any idea how I can approach this. Thanks a lot guys. Look froward to hear back from you.
4 Answers
Jeff Busch
19,287 PointsHi Carlos,
Maybe this will work:
@media only screen and (max-width: 320px), screen and (max-height: 480px) {
div
{
/*display your div here one way only*/
}
}
@media only screen and (max-width: 360px), screen and (max-height: 640px) {
div
{
/*display same div, different atribute*/
}
}
@media only screen and (max-width: 480px), screen and (max-height: 800px) {
div
{
/*display same div, and yet another different atribute*/
}
}
Carlos Diaz
Courses Plus Student 9,006 PointsGreat Jeff, let me give it a try,. Thank you very much!!
James Barnett
39,199 PointsIf you are still having issues, read up on how media queries work and post back here with any specific questions you've got.
- Media Queries section of Shay Howe's Advanced HTML & CSS Guide
- Media Queries page on HTML Dog
Carlos Diaz
Courses Plus Student 9,006 PointsThank you James. I will .