2012-04-25 7 views
18

Tengo las siguientes preguntas de los medios en mi CSS:Las consultas de medios fallan dentro de 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;} 
} 

y cinco marcos flotantes en tamaños correspondientes:

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

las consultas kick-in fine en el html independiente archivo, pero cuando se ve en un contexto iframe, fallan en IE9. Todos los demás navegadores muestran OK.

¿Alguien sabe por qué? gracias

[edit] Para el registro, el html padre e hijo tienen el mismo docType, y el CSS se sirve como text/css.

+0

¿Está escribiendo estas consultas de medios en hojas de estilo no externas? He estado trabajando en proyectos con contenido cargado en iframes desde hace meses y las consultas en los medios funcionaron exactamente como esperaba, sin embargo, recientemente hice una adición en la que coloqué mi CSS en las etiquetas '