jquery - CSS won't load on iPhone Refresh -
<link rel="stylesheet" media="screen , (min-width: 20px) , (max-width: 375px) , (orientation:portrait)" href="css/detailslayout280.css" /> <link rel="stylesheet" media="screen , (min-width: 20px) , (max-width: 375px) , (orientation:portrait)" href="css/copy280.css" /> <link rel="stylesheet" media="screen , (min-width: 376px) , (max-width: 700px) , (orientation:landscape)" href="css/detailslayout320.css" /> <link rel="stylesheet" media="screen , (min-width: 376px) , (max-width: 700px) , (orientation:landscape)" href="css/copy320.css" /> i have page css won't load on iphone, if switch orientation , forth will.
then clicking refresh, again css doesn't load until orientation change again.
this happens on secondary page only. home page set in same way , works fine.
i have this:
<meta name="viewport" content="width=device-width, initial-scale=1"> which need ipad css. if take out problem goes away phone (although zoomed out), need ipad.
why won't css load unless change orientation?
thanks.
you may need specify pixel density smartphones have 700px+ in width.
browser specific
(-moz-min-device-pixel-ratio: 2) (-o-min-device-pixel-ratio: 2/1) (-webkit-min-device-pixel-ratio: 2) (min-device-pixel-ratio: 2) a quick example of how might apply this
<link rel="stylesheet" media="screen , (min-width: 20px) , (max-width: 375px) , (orientation:portrait) , (-webkit-min-device-pixel-ratio: 2)" href="css/detailslayout280.css" />
Comments
Post a Comment