防止右浮動元素從交換

似乎每次我漂浮兩個元素正確的時間，就被換。這對於左浮動元素不會發生，並且它似乎在每個瀏覽器中。防止右浮動元素從交換

下面是一個例子：

CODE：

<style type="text/css"> 
    .right { 
     float: right; 
    } 
</style> 
<div class="right">DIV ONE</div> 
<div class="right">DIV TWO</div>

顯示效果：

DIV TWO DIV ONE

這不是一個真正的大問題，但與同事交換代碼時，它會造成混亂。有什麼辦法可以防止這種情況發生？

除了交換它們之外，沒有其他解決方案。 – SVS

這不是交換。這是完全正確的。試想一下，你的DIV ONE會在右邊第一個位置，你的DIV TWO會進入下面的右邊：D –

正確，但是與HTML看起來似乎交換了。我明白這就是CSS應該做的事情，但是對於只看HTML的人來說，這有點令人困惑。 – JacobTheDev

另一個可能的選擇是，而不是浮動的權利，只是text-align: right;。然後，將每個DIV標記爲display: inline-block;而不是block。根據你的確切情況，這可能會導致問題，但在很多其他情況下，它會工作得很好。

如果出現問題，你可以堅持的兩個div中包裝，並浮空到右側，然後用我的解決方案。然而，這是一個少一點的語義，但我認爲它最終並不重要。隨你便！

2012-06-28 17:06:11 Nathanael

哦。這回答了問題核心的實際問題：D +1 – Matchu

像左浮動元件，其流通量爲最左，直到它們擊中另一個向左浮動元件，右鍵浮動元素會浮最右可能直到他們打另一右浮動元素。這實際上是好的，一貫的行爲，因爲它可能乍一看令人困惑。

如果你感覺真的很瘋狂，你可能會嘗試用JavaScript之類的元素交換元素......但這會給非JS用戶造成嚴重破壞，並最終將這個問題與知道右浮動假設表現。交換的HTML爲了還真是去這裏的路，不好意思：/

2012-06-28 16:53:49 Matchu

這就是我想通。等待一段時間，看看是否有其他人有修復，如果沒有，我會接受你的。 – JacobTheDev

回答