CSS導航下拉填充

因爲它用於間隔出導航鏈接而不調整我的'nav ul li'的填充，我如何填充下拉鍊接背景的全部寬度'nav ul li ul li'，因爲它似乎只是填充一半的背景顏色。CSS導航下拉填充

(HTML): 

    <nav> 
    <ul> 
     <li><a href="#">Num 1</a></li> 
     <li><a href="#">Num 2</a></li> 
     <li><a href="#">Num 3</a></li> 
     <li><a href="#">Num 4</a></li> 
     <li><a href="#">Num 5</a></li> 
     <li><a href="#">Num 6</a> 
      <ul> 
       <li><a href="#">Drop 1</a></li> 
       <li><a href="#">Drop 2</a></li> 
      </ul></li> 
     <li><a href="#">Num 7</a></li> 
    </ul> 
</nav> 

    (css)

JSFIDDLE

注意：選擇不上傳的CSS，因爲我必須使用哈佛參照系統，並與網上片段相比，回來作爲即使這是我自己的工作更高的剽竊百分比任何相似之處，所以我會選擇在JSFiddle上傳更精確的代碼，因爲它不會從抄襲測試中返回。

來源

2014-10-01 Dianabolz

-1

以及一個快速的方法來解決這個問題是不是添加填充你只需要添加右邊的30像素，並留給導航UL李其最終被125px

nav ul li { 
    border-right: 1px solid #355e7f; 
    display: inline-block; 
    float: left; 
    width: 125px; 
}

下面是一個總寬度更新JSFIDDLE

希望有所幫助！

來源

2014-10-01 00:58:54 Amir5000

爲什麼不合理？你需要解釋爲什麼你投了我的答案。而不是隻是投了下來，沒有給出理由...... – Amir5000 2014-10-12 03:12:09

這裏是一個liworking demo

更改您的填充，以a：

nav ul li a {width:65px; display:inline-block; padding:0 30px}

，並添加顯示器和漂浮禮儀到second-level li：

nav ul li ul li { padding:0; border:none;display: list-item;float: none }

來源

2014-10-01 01:08:21 dippas

@Brian，感謝您的編輯;） – dippas 2014-10-01 01:12:52

CSS導航下拉填充

回答

相關問題