Reputation: 458
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
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
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