頂部和底部邊框的CSS邊框問題

我在這裏有這個網站http://jamessuske.com/freelance/paoladi/，我將邊框頂部和底部應用於我的導航欄，所以我有兩個邊框。但由於某種原因，這兩個邊界處於頂端......我做錯了什麼？頂部和底部邊框的CSS邊框問題

.navigation{ 
    border-top:1px solid #000; 
    border-bottom:1px solid #000; 
    text-transform:uppercase; 
}

這個類上面是一個標頭類和頭類內是一種標識類和社會化媒體類，一個漂浮左側和右側漂浮。頭類沒有分配浮點數。

來源

2013-06-20 user2499454

只是將'float：left'賦給'.navigation'類，將'clear：left'賦予'.contentArea'。 –

添加float: left到.navigation類

來源

2013-06-20 05:57:41

你的所有li元素的左側浮動。您需要在清單後清除。

嘗試增加

<div class="clearboth"></div>

的UL

來源

2013-06-20 06:00:32 kcsoft

後有這樣做的幾種方法。

選項1

嘗試施加display:inline-block和width:100%;

比如：

.navigation { 
    border-bottom: 1px solid #000000; 
    border-top: 1px solid #000000; 
    display: inline-block; 
    text-transform: uppercase; 
    width: 100%; 
}

WORKING SOLUTION

選項2

以像素爲單位使用固定的height。

比如：

.navigation { 
    border-bottom: 1px solid #000000; 
    border-top: 1px solid #000000; 
    height: 65px; 
    text-transform: uppercase; 
}

WORKING SOLUTION

希望這有助於。

來源

2013-06-20 06:00:55 Nitesh

頂部和底部邊框的CSS邊框問題

回答

相關問題