Brant Barton
Brant Barton

Reputation: 458

iPad Media query

I've tried a few suggestions (device-width:768px) (min-device-width: 768px) and (max-device-width: 1024px)

but I can't seem to get anything to work to make CSS target iPad. I'm only testing on an iPad 1st gen though. Is there a separate Media Query for 1st gen?

Also, I'm not sure if it's important to mention that I used:

<meta name="viewport" content="width=device-width"/>

Upvotes: 1

Views: 3435

Answers (2)

Brant Barton
Brant Barton

Reputation: 458

May have gone overboard, but until it becomes a problem I'm not going to adjust it. I used:

@media(min-device-width: 650px) and (max-device-width: 1024px) {

and it worked.

Upvotes: 1

SeanCannon
SeanCannon

Reputation: 77986

I prefer to use the aspect ratios vs the widths:

iPhone < 5:

@media screen and (device-aspect-ratio: 2/3) {}

iPhone 5:

@media screen and (device-aspect-ratio: 40/71) {}

iPad:

@media screen and (device-aspect-ratio: 3/4) {}

Upvotes: 6

Related Questions