5

I'm doing some testing on IE 11 and it's using the CSS for mobile devices and not the "full screen" css. Chrome, Firefox, Opera and Safari all use the correct "full screen" CSS, but IE 11 is grabbing the mobile/media css. I've cleared the cache multiple times and looked at the CSS sheet that it's grabbing, and it is using the most up-to-date version.

In the head I have

<!DOCTYPE html>

<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="/css/default.css">
</head>

In the CSS file, I have the following after all of the "full sized" css

//"full sized" css
....

@media only screen and (max-width: 479px) {
  //mobile CSS
}

IE 11 on my laptop is using the media CSS and I can't figure out why. I know it's using the media only section and not just formatting incorrectly, because when I delete the media only section from the CSS, it then displays as expected.

user1406951
  • 454
  • 1
  • 10
  • 28

1 Answers1

3

can you try this:

@media all and (max-width: 479px) {
  //mobile CSS
}

with all you are targeting all devices, and not only the desktop version you are now targeting with screen.

For mobile only, you would do this:

@media (max-width: 600px) {
  //mobile CSS
}
Mark
  • 6,762
  • 1
  • 33
  • 50
  • Yep, that was it! Thank you. Are there any issues that I should look into by using all? Just curious, because I've never seen "all", and if it does indeed cover everything, why doesn't everyone use that? – user1406951 Feb 28 '14 at 00:12
  • all, is most for testing/developing, but you can leave it as is, does no harm. All is all devices, screen is laptop, desktop, so no mobile, you can also do media print. – Mark Feb 28 '14 at 00:16
  • `screen is laptop, desktop, so no mobile` - although most 'mobiles' ignore `mobile` anyway and use `screen`. – ralph.m Feb 28 '14 at 00:22
  • 4
    I have exactly the same issue, but this solution didn't solve it, IE 11 is still using the mobile/media css. – Sean Aug 01 '14 at 15:07
  • @Sean did you get any solution for this? – Vipin Raunchhela Dec 21 '16 at 06:41