Handling orientation changes

Not only do web designers have to deal with an almost overwhelming number of…differently sized screens, but also screens that rotate, ay, ay, ay!…Of course, that's the over-the-top reaction.…The reality is that you can easily create Media Queries that respond to a…device screen depending on its orientation.…So I have opened profile.htm from Chapter 4/04_03.…Let's switch to Code view for a second and take a look at our associated mquery.css file.…

Min-width and max-width that we see here are far from the only Media Query…parameters available to us.…There is also one that's specifically geared towards handling changes in…orientation, and it's-- you guessed it--orientation.…So we could create a whole new @import statement.…that just had the orientation parameter, or if we want to say use the tablet.css…import rule that we see on line 7, we can actually add another Media Query to…that same rule, and we do that by putting in a comma and then your Media Query.…

So you can have as many of these as you like, and each of them will work with tablet.css.…