2011-02-22 142 views
1

我正在努力解決HTMl/Css問題。我使用ul和li創建標籤。選項卡列表是動態的,最多可以擴展到10個選項卡。問題在於列表在100%寬度上突出,並且選項卡重疊。是否可以計算列表達到接近100%寬度的時間,以便我可以創建第二組選項卡?多行標籤

這裏是一個例子的鏈接。

http://jsfiddle.net/syEJx/5/

標籤8,9和10的上部文本被截斷。我想避免這種

感謝

+1

你可以舉一些示例代碼來演示這個問題。 – Alpine 2011-02-22 20:02:45

+0

@高山。我通過指向示例代碼的鏈接編輯了我的問題。 – DG3 2011-02-22 20:43:16

回答

0

這個怎麼樣?

Live Demo

enter image description here

新的CSS:

.tabs li 
{ 
    display: inline-block; 
    margin: 0 0 15px 0; 

    /* ie7 hacks */ 
    zoom:1; 
    *display: inline; 
    _height: 20px 
} 

它包括必要使它在IE7可接受工作黑客。如果你不關心IE7,隨時刪除這三行。

1

CSS(沒有JavaScript的幫助下)以這種方式,但如果你的李時珍是沒有高度限制和一定寬度的UL內浮動不能計算維度,然後你的標籤會填充從左到右和從上到下。另一種選擇可能是將你的ul設置爲顯示:block和你的li顯示:inline。這可能會更好,因爲ul會擴展到li的範圍。我認爲這是你正在尋找的行爲。