• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 185
  • Last Modified:

Relates to writing CSS media queries

Okay smart guys (and that's intended to be a compliment, not a sarcastic remark), here we go. :)

I have a simple one page website I'm working on . . . basically a video player embedded on a page with some very basic content surrounding it (accept for small mobile devices . . . in which case I intend to load the video player only). I'm hoping to use a simple style sheet with 3 or 4 breaking points using the min or max device-width property. (And that get's confusing as well . . . whether to use the min or max prefix.)

Anyway, one thing that confuses me is the way iPad screen resolutions are listed online. Sometimes it's 1024 x 768, sometimes 768 x 1024. Which is truly the width and which is truly the height? Which also leads to another question. Particularly with tablets (and especially with my application and the pixel cutoff point I might use), when a user rotates a tablet from portrait mode to landscape mode, could the browser potentially load a totally different style sheet . . . if using the min and max device-width property? In other words, does the device width change when the user rotates the device from portrait mode to landscape and vise versa? I'm hoping not . . . because that would seem to make writing the style sheet a whole lot more complex.
0
Thunderman54
Asked:
Thunderman54
1 Solution
 
GaryCommented:
Which is truly the width and which is truly the height
Both

To detect orientation and load relevant css use (along with any dimensions you are targetting).

@media (orientation:portrait) {
}

@media (orientation:landscape) {

}

Open in new window

0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Upgrade your Question Security!

Your question, your audience. Choose who sees your identity—and your question—with question security.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now