how to target css to iPad but exclude Safari 4 desktop using a media query?
- by miriam835work
I am trying to use a media rule to target css to iPad only. I want to exclude iPhone/iPod and desktop browsers. I would like to to also exclude other mobile devices if possible.
I have used
<style type="text/css" media="only screen and (min-device-width: 768px) and (max-device-width: 1024px)">
but just found out that desktop Safari 4 reads it. I have tried variations with "481px" instead of "768px" and another that adds an orientation to that:
<style type="text/css" media="only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait)">
but not luck. (Later we will be sniffing user-agent strings for iPad, but for now that solution won't work.)
Thanks!