How to make IE 8 and 9 read the conditions of Media Query? I have read some docs but I did not find anything enlightening.
The query is being done in the HTML example and I would not like to apply it to just one CSS.
<link rel="stylesheet" media="screen and (max-width: 1366px)" href="css/1366.css" />
Some things to consider:
IE9 supports media-query , but you need to make sure to be in standards mode , ie your <doctype> must be correct, and due care taken with the html taken. Note that IE9 does not respect media-queries within <iframe> .
As for IE8, there is no way to use media-query . The solution would be for a conditional comment, like the one below, and load a specific javascript to resolve the issue.
Just will not have IE8 on mobile devices, so maybe a simplified CSS inside the conditional comment already solves it.
Here is the conditional comment :
<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" media="all" href="estilo_ie8.css"/>
... e/ou ponha seu JS aqui...
<![endif]-->
Take a look at Respond.js for this purpose.