如何浮動的CSS

內聯元素可以說我有以下標記：如何浮動的CSS

<ul class="editor"> 
<li> 
    <a href="#">Modules</a> 
    <a href="#">View</a> 
    <a href="#">Add</a> 
</li> 
<li> 
    <a href="#">Sections</a> 
    <a href="#">View</a> 
    <a href="#">Add</a> 
</li> 
</ul>

我如何浮動「視圖」，因此，正確的，使他們出現在同一「添加」向右訂單爲html？

現在如果我做

.editor li a:nth-child(2), .editor li a:nth-child(3){ 
    float:right; 
}

我會得到一排，看起來像：

Modules       Add View

，但我想

Modules       View Add

這可能只是通過CSS3 ？

編輯：對不起，我應該提到，我沒有訪問的HTML。只有css

來源

2011-05-08 Jess

每個「李」在它自己的行，對不對？（你清除浮標等） – BoltClock 2011-05-08 23:20:18

你自動浮起的任何東西都會成爲塊級別。 – alex 2011-05-08 23:22:37

文本對齊li權和浮只有1 a左側。

.editor li { 
    text-align: right; 
} 
.editor li a:nth-child(1) { 
    float: left; 
}

我假設你已經隱藏的默認列表子彈。

來源

2011-05-08 23:26:48 BalusC

我意識到這個問題「只通過CSS3」，但是......「a：first-child」;） – BoltClock 2011-05-08 23:33:41

重新組織您的DOM，以便在查看之前添加並將它們浮動到右側。

來源

2011-05-08 23:21:27 yoka

對不起，我應該提到，我沒有訪問的HTML。只有css – Jess 2011-05-08 23:26:52

只需更改訂單。

<ul class="editor"> 
<li> 
    <a href="#">Modules</a> 
    <a href="#">Add</a> 
    <a href="#">View</a> 
</li> 
<li> 
    <a href="#">Sections</a> 
    <a href="#">Add</a> 
    <a href="#">View</a> 
</li> 
</ul>

來源

2011-05-08 23:22:31 cvsguimaraes

對不起，我應該提到，我沒有訪問的HTML。只有css – Jess 2011-05-08 23:27:18

嘗試用明確的分配CSS3靈活的盒子模型和box-ordinal-group財產（http://hacks.mozilla.org/2010/04/the-css-3-flexible-box-model/） - 如果你不能使它與彩車工作，也許它提供達到同樣的效果有些另類。除此之外，當然，您可以通過其他方式更改DOM順序或模擬佈局，但如果要保存結構，則不可取。

來源

2011-05-08 23:27:27 entonio

如何浮動的CSS

回答

相關問題