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

Question

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

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

Он работает за пределами блока @media в Firefox:

@import 'screen.css'; 

UPDATE:

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

@media screen { 

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

} 

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

Answer 1

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

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

Вот уместный раздел спецификации CSS2: 6.3 The @import rule.

Answer 2

Итак, Firefox не нравится метод, который я выбрал, одобряя:

@import 'stylesheet.css' media_type; 

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

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