2012-04-25 13 views
18

Ho le seguenti media query nel mio CSS:media query non riescono dentro IE9 iframe

@media screen and (min-width: 0px) and (max-width: 319px) { 
    body {background-color:red;} 
} 

@media screen and (min-width: 320px) and (max-width: 480px) { 
    body {background-color:orange;} 
} 

@media screen and (min-width: 481px) and (max-width: 980px) { 
    body {background-color:yellow;} 
} 

@media screen and (min-width: 981px) and (max-width: 1200px) { 
    body {background-color:green;} 
} 

@media screen and (min-width: 1201px) { 
    body {background-color:blue;} 
} 

e cinque iframe con dimensioni corrispondenti:

<iframe frameBorder="0" src="index.html" height="320" width="255" ></iframe> 

le query kick-in fine in html standalone file, ma se visualizzati in un contesto iframe, falliscono in IE9. Tutti gli altri browser visualizzano OK.

Qualcuno sa perché? grazie

[modifica] Per la registrazione, l'html padre e figlio hanno lo stesso docType e il CSS viene offerto come testo/css.

+0

Stai scrivendo queste query multimediali in fogli di stile non esterni? Ho lavorato su progetti con contenuti caricati in iframe da mesi e le media query hanno funzionato esattamente come previsto, tuttavia, di recente, ho aggiunto un'aggiunta in cui ho inserito il mio CSS nei tag '