在ff/opera中使用margin-left auto的css3轉換

我有#header -lelement和margin: 0 auto。我添加了一個媒體查詢：在ff/opera中使用margin-left auto的css3轉換

@media screen and (max-width: 950px) { 
#header { 
-webkit-transition: all 0.6s ease-out; 
-moz-transition: all 0.6s ease-out; 
-o-transition: all 0.6s ease-out; 
margin-left: 0; 
} 
}

-moz和-o忽略過渡屬性：margin-left立即設置爲0，而-webkit行爲與預期相同。當使用數字而不是auto時，firefox和opera會應用轉換。

如何讓Mozilla和Opera在應用轉場時仍然使用auto？

來源

2012-03-02 Mathias

在[在這小提琴] OSX FF工作（http://jsfiddle.net/heSmW/）。也許你沒有關閉媒體查詢的大括號？你當然沒有在你的代碼中，但我不知道它是否是一個錯字... – scumah 2012-03-02 17:25:57

是的，這是一個錯字，我糾正了它。你的小提琴確實適合歌劇，但不適合ff。我在一臺Windows機器上。 – Mathias 2012-03-03 12:00:02

@scumah：使用更長的持續時間（開始〜1.2s）確實解決了ff中的問題，但不是在我自己的設置中。隨着1.1s的持續時間，它有時任意部分地工作。 – Mathias 2012-03-04 13:55:52

使用-moz-transition: all 0.6s cubic-bezier(0, 0, 0.58, 1) 0s;似乎適用於Ubuntu上的Firefox。（這就是Opera解釋ease-out的原因。）在Windows上嘗試。

來源

2012-03-03 21:12:58 silvenon

這並沒有解決問題。無論如何，我認爲這就是我的規則內部翻譯的內容。 – Mathias 2012-03-04 13:45:24

在ff/opera中使用margin-left auto的css3轉換

回答

相關問題