Question

i want to test the orientation by using css for ipad.This is the css file i use

@media only screen and (device-width:768px) and(orientation:portrait) {
  body { background: green; }
}


@media only screen and (device-width:768px) and(orientation:landscape) {
  body { background: red; }
} 

I am not sure whether this will work or not. I tried testing in an iphone emulator by changing the device width to 320px.But it didn’t work. Do i need to change anything in this css file?
This is how i call the css in the main page

<link rel="stylesheet" type="text/css" href="iPad.css" />"

Answer 1

I resolved the problem by using this css.

   @media only screen and (device-width:768px) and(orientation:portrait) {
      body { background: green; }
    }


    @media only screen and (device-width:768px) and(orientation:landscape) {
      body { background: red; }
    }