水平導航無法正確對齊

我知道這已在此處討論過 - 因爲我已閱讀了許多關於同一事物的問題。並試圖解決方案，但我似乎無法使這個愚蠢的導航右對齊（需要鋰塊對齊到右側）。有人可以指出我的錯誤 - 謝謝。水平導航無法正確對齊

http://jsfiddle.net/gstricklind/vP38J/4/

CSS

ul#menu-main-top { 
    float: right; 
} 
.nav-bar > li { 
    border: 1px solid #333; 
    display: block; 
    float: left; 
    line-height: 38px; 
    margin: 0; 
    padding: 0; 
    position: relative; 
} 
ul#menu-main-top li a { 
    color: #222222 !important; 
} 
.top-nav > li > a { 
    color: #E6E6E6 !important; 
} 
.nav-bar > li > a:first-child { 
    margin: 0 0 0 10px; 
    padding: 0 0 0 30px; 
} 
.nav-bar > li > a:first-child { 
    display: block; 
    font-size: 14px; 
    padding: 0 20px; 
    position: relative; 
    text-decoration: initial; 
}

HTML

<div class="eight columns"> 
    <ul id="menu-main-top" class="top-nav nav-bar hide-for-small"> 
     <li id="menu-item-58">     
      <a href="#">Home</a> 
     </li> 
     <li id="menu-item-94"> 
      <a href="#">Calendar</a> 
     </li> 
     <li id="menu-item-59"> 
      <a href="#">Meanings</a> 
     </li> 
     <li id="menu-item-77"> 
      <a href="#">About Us</a> 
     </li> 
     <li id="menu-item-67"> 
      <a href="#">Contact Us</a> 
     </li> 
     <li id="menu-item-343" class="active"> 
      <a href="#">My Account</a> 
     </li> 
     <li class="logout"> 
      <a href="#">Logout</a> 
     </li> 
    </ul>      
</div>

來源

2013-01-02 gstricklind

看起來與我的權利保持一致。它出什麼問題了？ – jmeas

所有的li都在ul的左邊對齊。 ul對齊。但我需要所有李的權利。所以當添加更多的李時，他們不會從左邊開始，而是從右邊開始。我有道理嗎？我已經在Safari，Firefox和Chrome中進行了測試（或嘗試過）。 – gstricklind

對不起，改了標題 - 它可能是混亂。 – gstricklind

難道這就是你想幹什麼？

http://jsfiddle.net/vP38J/5/

培訓相關改變代碼：

.nav-bar > li { 
    border:1px solid #333; 
    display:block; 
    float: right; 
    line-height:38px; 
    margin:0; 
    padding:0; 
    position:relative; 
}

另外，如果你正在尋找有順序保持不變，只是扭轉HTML列表的順序。

來源

2013-01-03 00:06:24

是的，但鏈接反轉。我試圖像這樣對齊，但鏈接順序需要是正常的。通常情況下，我不會有什麼問題搞清楚這一點..不知道我這次做錯了什麼。 – gstricklind

也許這個解決方案對你想要的更好：http：//jsfiddle.net/vP38J/7/ 我將塊從塊更改爲內聯塊，並刪除了浮動。然後爲ul添加一個文本對齊權限。 –

我認爲就是這樣！我不知道爲什麼我沒有考慮去除那個浮點數：離開li。謝謝！ – gstricklind

水平導航無法正確對齊

回答

相關問題