@import в @media не работает в Firefox 3.0.3

Question

Это то, что у меня есть, которое работает в IE7, но не в Firefox:

@media screen { @import 'screen.css'; }

Работает вне блока @media в Firefox:

@import 'screen.css';

ОБНОВЛЕНИЕ:

Это работает:

@media screen { 

    .yui-d3f
    {
        border: 1px solid #999;
        height: 250px;
    }

}

Чего мне не хватает?

Answer 1

Firefox следует спецификации CSS2, в то время как IE играет как бы быстро и свободно.

Точная причина в том, что директивы @import должны быть первыми директивами после необязательной директивы @charset. Они не могут появляться внутри какого-либо блока. Если вы хотите, чтобы @import применялся только к одному типу носителя, укажите это после импортированного URI.

Вот соответствующий раздел спецификации CSS2: 6.3 Правило @import .

Answer 2

Хорошо, поэтому Firefox не нравится выбранный мной метод, в пользу:

@import 'stylesheet.css' media_type;

Но IE7 не понимает этот метод, но это может быть хорошо:

@import 'firefox-screen.css' screen;
@media screen { @import 'IE7-screen.css'; }