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