菜單作爲無序列表水平或表？

我有一個無序的列表，我水平顯示爲頁面的頂級菜單欄。我已經得到它顯示相對較好，雖然我一直在玩IE6和IE7的間距導致它不能正確顯示。令人震驚的。無論哪種情況，使用表格來顯示菜單還是使用一些CSS黑客更好？我無法找到解決辦法？什麼是顯示菜單的最佳方式？我應該添加一些使用自己的無序列表的下拉菜單的選項。菜單作爲無序列表水平或表？

來源

2010-01-11 Eric Di Bari

我在說的菜單可以在這個頁面上看到 - http://www.sustainablebolivia.org/about.html – 2010-01-11 15:42:38

退房List-a-matic，它有許多不同的菜單模板，您可以用作基地。

一個簡單的橫向列表可以使用CSS和無序列表中顯示

HTML

<div id="navcontainer"> 
<ul id="navlist"> 
    <li id="active"><a href="#" id="current">Item one</a></li> 
    <li><a href="#">Item two</a></li> 
    <li><a href="#">Item three</a></li> 
    <li><a href="#">Item four</a></li> 
    <li><a href="#">Item five</a></li> 
</ul> 
</div>

CSS

#navlist li 
{ 
display: inline; 
list-style-type: none; 
padding-right: 20px; 
}

來源

2010-01-11 15:24:01

很難從你身邊給沒有SSCCE一個明確的答案（純文本<html>包括文檔類型和嵌入式樣式），它精確地再現你有問題。但我至少可以告訴你常見的問題是，你沒有得到the doctype，IE's boxmodel bug在這裏扮演一個角色。

如果這不是根本原因，那麼下一個可能的原因是未能理解如何使用floats和/或內嵌/塊元素。爲了得到好的和堅實的代碼示例，Google "suckerfish menu"。

來源

2010-01-11 15:24:22 BalusC

我第二個建議學習suckerfish imlementation的來龍去脈。即使你不需要使用完整的實現，它也會爲你提供你需要知道的每一個單詞（幾乎哈哈），以便使用浮動的「li」作爲菜單。 – prodigitalson 2010-01-11 15:52:55

編輯：

你不能依靠display: inline-block來處理這一點，因爲跨瀏覽器的支持是有問題的。使用花車代替dispaly: inline; position: relative。我會繼續使用UL的。不要使用黑客攻擊IE *儘管 - 使用IE條件爲不同版本的IE添加不同的樣式表。

來源

2010-01-11 15:24:41 prodigitalson

菜單作爲無序列表水平或表？

回答

相關問題