min-width media query not working on ipad?

The iPad is always reporting its width as 768px and its height as 1024px, so you have to find out how it is rotated with orientation and use min-device-height:1000px like so:

     /* This will apply to all screens with a width 999px and smaller */
* {
     color:green;
     background-color:black;
}

     /*
       This will apply to all screens larger then 1000px wide 
       including landscape ipad but not portrait ipad. 
      */
@media (orientation:landscape) and (min-device-height:1000px),
       all and (min-width:1000px) {
    * {
        color:white;
        background-color:red;
    }
}

Results:

• iPad
  • Portrait       - green text - black background
  • Landscape - white text  - red background
• iPhone
  • Portrait       - green text - black background
  • Landscape - green text - black background
• Computer (resolution)
  • 1680x1050 - white text  - red background
  • 800x600     - green text - black background

Using chrome & firefox (does anyone even use IE anymore?)

References:
w3 media queries
Safari CSS Reference
Optimizing Web Content

From http://perishablepress.com/press/2010/10/20/target-iphone-and-ipad-with-css3-media-queries/

/* iPad [portrait + landscape] */
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
    .selector-01 { margin: 10px; }
    .selector-02 { margin: 10px; }
    .selector-03 { margin: 10px; }
}

It looks like the screen attribute may be required.