Медиа-запросы не работают внутри IE9 iframe

У меня есть следующие медиа-запросы в моем CSS:

@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;}
}

и пять iframe соответствующего размера.:

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

Запросы выдаются -нормально в автономном html-файле, но при просмотре в контексте iframe они терпят неудачу в IE9. Все остальные браузеры показывают ОК.

Кто-нибудь знает почему? спасибо

[править] Для записи родительский и дочерний html имеют один и тот же docType, а CSS обслуживается как text/css.