選項卡菜單重疊

我犯了一個CSS菜單，但各個選項卡，或者更確切地說，分頁行，似乎是相互重疊。我用的白色空間：預包裝與標籤菜單本身的寬度：選項卡菜單重疊

enter image description here

html > body > div#header > div#header-bottom-left > ul.tabmenu { 
position: absolute; 
top: 75px; 
left: 700px; 
width: 620px !important; 
} 

#header #header-bottom-left .tabmenu li { 
font-family: "Courier New", Courier, monospace !important; 
text-transform: uppercase; 
letter-spacing: 2px; 
font-variant: small-caps; 
font-size: 11px; 
padding: 5px; 
margin-right: 16px; 
background: url(%%buttons%%) repeat-x; 
border: 1px solid black; 
white-space: pre-wrap; 
margin-bottom: 20px; 
}

來源

2011-09-30 Haman

能否請您發佈的HTML呢？ –

在一般情況下，不樣式的LI爲菜單，風格A標籤和使用display:block或inline-block

來源

2011-09-30 20:42:33

不知道這是你想要的，但我認爲你可能會丟失你的li

代碼float: left：http://jsfiddle.net/vT5vd/

BTW名單是夢幻般的菜單和使用等幾乎完全！

來源

2011-09-30 20:50:42 checkenginelight

的選項卡一樣處理一行文字。行間距設置爲文本的高度，導致較大的製表符重疊。要糾正此只需添加一個的line-height：1.8; 線在選項卡列表項部分的CSS文件。也。您可以在選項卡列表中放置中斷或段落標記，以控制它們換行到下一行的位置，並避免分割選項卡。

ul.tabs li a 
{ 
    font: normal 18px Verdana; 
    line-height: 1.8; 
    text-decoration: none; 
    position: relative; 
    padding: 0px 8px; 
    border: 1px solid #CCC; 
    border-bottom-color:#AAA; 
    color: #000; 
    background: #F0F0F0 url(tabbg.gif) repeat-x 0 0; 
    border-radius: 2px 2px 0 0; 
    outline:none; 
}

來源

2014-08-09 21:00:38

選項卡菜單重疊

回答

相關問題