菜單欄，我已經試過各種

-2

出於某種原因，下面的代碼不會在頁面上居中，甚至當我在鍵入許多不同的代碼。菜單欄，我已經試過各種

下面是代碼：

@charset "utf-8"; 
/* CSS Document */ 

#nav { 
font-family:Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter",  Monaco, "Courier New", monospace; 
margin: 0 0 3em 0; 
padding: 10px 50%; 
list-style: none; 
margin-left:auto; 
margin-right:auto; 
display: inline-block; 
} 
#nav li { 
float: left; 
} 
#nav li a { 
padding: 8px 15px; 
text-decoration: none; 
color:white; 
display:inline-block; 
font-size:18px; 
} 
#nav li a:hover { 
color:#00BFFF; 
} 
#header { 
margin-top: 0; 
width:100%; 
height:150px; 
background-color:#09F; 
}

請注意，導航欄位於標題內。

來源

2013-03-12 BakerzHosting

請在[jsFiddle]（http://jsfiddle.net） – Adrift 2013-03-12 22:34:06

中提供您的代碼問問你不認識的人可以免費做到！給自己一個程序員吧！ – jtheman 2013-03-12 22:34:52

調試此類事件的一種非常方便的方式是使用Chrome或Firefox，並使用開發人員工具查看甚至編輯所討論元素的CSS。在Chrome中，轉到相關頁面，然後右鍵單擊（按住Control鍵並單擊），然後選擇檢查元素。這將在左邊顯示適用於該元素的所有CSS，包括被另一種樣式覆蓋的任何內容。您也可以點擊該區域並插入新的CSS指令;這種直接編輯甚至比通常的編輯/瀏覽器重新加載循環更快。 – JohnJ 2013-03-12 22:37:51

jsFiddle

你只需要卸下<ul>顯示屬性，並給它寬度。我也刪除了列表中的填充。

來源

2013-03-12 22:44:12 Adrift

它仍然不工作 – BakerzHosting 2013-03-12 22:45:52

http://jsfiddle.net/GWCnf/6/ – Adrift 2013-03-12 22:47:09

謝謝你很多：D：D – BakerzHosting 2013-03-12 22:49:22

嘗試與

#nav { 
font-family:Consolas, "Andale Mono", "Lucida Console", "Lucida Sans Typewriter",   Monaco, "Courier New", monospace; 
margin: 0 auto 3em; 
width: XXpx 
padding: 10px 50%; 
list-style: none; 
margin-left:auto; 
margin-right:auto; 
display: inline-block; 
}

，並定義寬度

編輯：

function onload() { 
document.getElementById("nav").style.marginLeft = Math.round(document.getElementById("nav").offsetWidth/2)+"px";}

來源

2013-03-12 22:36:09

http://jsfiddle.net/GWCnf/1/ – BakerzHosting 2013-03-12 22:36:44

是不是中心？ – 2013-03-12 22:39:42

由於某種原因，它仍然沒有到中間，它的左側 – BakerzHosting 2013-03-12 22:40:04

菜單欄，我已經試過各種

回答

相關問題