@ -moz-文档不起作用

Question

最后，我想让firefox和chrome以同样的方式显示。在铬我注意到，float: left打破了网站，但在FF工程。但是，如果我将float:none Chrome完美显示，但它在FF上被打破。

我试过@-moz-document url-prefix() {.attempt{float:left}}但似乎没有工作。我试过@document url() {.attempt{float:left}}但这也没有帮助。

任何帮助将不胜感激。

<style> 
    @-moz-document url-prefix() { 
    .attempt { 
     float:left 
    } 
    } 
    .attempt { 
    float:none 
    } 
</style> 

<div class="attempt">someText</div> 

而且It has been asked before with no answer.

Answer 1

从表面上看，似乎是因为你@-moz-document出现float:none规则之前 - 所以它总是会得到无论覆盖。有条件的规则不会改变级联的工作方式;这是一个commongotcha与@media规则，也适用于@-moz-document。

你想把它移到底部，所以它会覆盖以前的规则正确的Firefox：

<style> 
    .attempt { 
    float:none 
    } 
    @-moz-document url-prefix() { 
    .attempt { 
     float:left 
    } 
    } 
</style> 

<div class="attempt">someText</div>