PSD to HTML conversion PSD to HTML conversion PSD2HTML.com with over 300 professionals takes the designs to HTML and beyond

Code Snippet

Home » Code Snippets » CSS » iPad-Specific CSS

iPad-Specific CSS

@media only screen and (device-width: 768px) {
  /* For general iPad layouts */
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
  /* For portrait layouts only */
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) {
  /* For landscape layouts only */
}

Subscribe to The Thread

  1. No Biggie. But you’re missing a closing slash on your second comment line.

    Thanks!

  2. I’d love to see a screencast on designing for an iPad
    i’m sure it’s like the iPhone one you made but still…

  3. This CSS will also be used by *all small screens* – this might be undesirable since often the CSS issues (such as position fixed) may not apply to netbooks for instance where the browser and os may be different to an ipad….

Speak, my friend

At this moment, you have an awesome opportunity* to be the person your mother always wanted you to be: kind, helpful, and smart. Do that, and we'll give you a big ol' gold star for the day (literally).

Posting tips:
  • You can use basic HTML
  • When posting code, please turn all
    < characters into &lt;
  • If the code is multi-line, use
    <pre><code></code></pre>
Thank you,
~ The Management ~