Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

Relates to writing CSS media queries

Posted on 2014-11-23
1
Medium Priority
?
176 Views
Last Modified: 2014-11-23
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
Comment
Question by:Thunderman54
1 Comment
 
LVL 58

Accepted Solution

by:
Gary earned 2000 total points
ID: 40460708
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

Featured Post

[Webinar On Demand] Database Backup and Recovery

Does your company store data on premises, off site, in the cloud, or a combination of these? If you answered “yes”, you need a data backup recovery plan that fits each and every platform. Watch now as as Percona teaches us how to build agile data backup recovery plan.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

CTAs encourage people to do something specific to show interest in your company, product or service. Keep reading to learn why CTAs should always be thought of as extremely important, albeit small, sections of websites.
How do you create a user-centered user experience on your website? And what are some things you should consider in the process?
This tutorial demonstrates how to identify and create boundary or building outlines in Google Maps. In this example, I outline the boundaries of an enclosed skatepark within a community park.  Login to your Google Account, then  Google for "Google M…
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
Suggested Courses
Course of the Month14 days, 11 hours left to enroll

577 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question