CSS-Tricks*

A Web Design Community curated by Chris Coyier

A little dab'll do ya

Code Snippets

Code Snippets > CSS > iPad-Specific CSS Submit one!

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. Chikezie says:

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

    Thanks!

  2. adam says:

    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…

It's Your Turn

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 ---