0

I use media-queries for responsive design on my website, and uses respond.js to ensure it works in browsers that don't support media queries. But when I tested it on IE8, it didn't work.

From other Q&A, I have ensured that I:

  1. place the respond.js script after the CSS
  2. it is ran on a server and not locally with a file:// protocol
  3. Avoided any cross-browser issues
  4. Made sure my include path is correct(!)

But none solved the issue.

Community
  • 1
  • 1
dayuloli
  • 16,205
  • 16
  • 71
  • 126

1 Answers1

1

I have found that including too many styles within media queries will sort of 'overload' it, and nothing within the media queries will show at all. I have tested this by removing all but one style within the media queries and it worked again.

The 'solution' is to place as much CSS outside media queries as possible (use overriding properties instead) and combine multiple media queries into one, which is good practice anyways.

This might have been the issue here also, where the last media query didn't work because of overloading.

A similar conclusion was made by another developer from 29 Steps.

Community
  • 1
  • 1
dayuloli
  • 16,205
  • 16
  • 71
  • 126