Help: Why can't the middle navigation bar be centered? _html/css_WEB-ITnose

中间的导航条无论如何都不能居中 ?rz..本人刚开始学html和css，菜鸟一个，望各位高手能指点一二，谢谢！


css代码：

body {
background:#efefef;
text-align:center;
margin:0;
padding:0;
}

#main {
width:950px;
background:#fffacd;
margin:0 auto;
padding:0;
}

#header {
background:#0ff ;
height:180px;
width:950px;
margin:0 auto;
text-align:center;
}

#logo {
background:#044 url(logo.jpg) no-repeat;
width:950px;
height:150px;
margin:0;
padding:0;
}

/********************navbar******************/


#navbar {
margin:0 auto;
padding:0;
background:#ccc;
width:auto;
height:30px;
text-align:center;
}

#navbar ul {
list-style-type:none;
background:#CDB7B5;
width:auto;
margin:0 auto;
padding:0 auto;
height:30px;
clear:both;
}

#navbar ul li {
display:block;
float:left;
width:auto;
  text-align:center;
}

#navbar ul li a {
padding:0 5px 0 5px;
height:30px;
float:left;
text-decoration:none;
background:#FFE1FF;
color:black;
line-height:1.5 em;

}

#navbar ul li a:hover {
color:#9C9C9C;
background:#CAE1FF;
}

#navbar .fg {
float:left;
width:1px;
height:30px;
background:black;
}

/********************************************/
#content {
background:#ffffe0;
width:950px;
padding:auto;
margin:auto;
overflow:hidden;
}

#footer {
background:#fff0f5;
width:950px;
height:100px;
padding:0;
margin:auto;
clear:both;
}

/*content内容 left,mid,right */
#left {
margin:0;
float:left;
width:200px;
}

#mid {
background:#0f0;
margin-top:0;
margin-left:4px;
float:left;
padding:0 auto;
width:562px;
height:250px;
}

#right {
background:#00f;
margin:0;
float:right;
width:180px;
padding:auto;
}


HTML：

nbsp;html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

  

  
• sdahg

  

  
• sdahg

  



  

  

 

adsfadsf

• ffff


• akgha


• adsga


• daghad


• ahgad


• dagha


• aghhh


• dahg



asdfad



• adgh


• adgh


• adgh


• adgh


• adgh


• adgh


• adgh


• adgh


• adgh


• adgh

• asdgdhsa


• asdgdhsa


• asdgdhsa


• asdgdhsa


• asdgdhsa


• asdgdhsa


• asdgdhsa


• asdgdhsa


• asdgdhsa


• asdgdhsa


• asdgdhsa

Reply to discussion (solution)

Which browser are you on? Seen below?

I looked at IE6/7/8 and it didn’t run!

It doesn’t work under Firefox 3.6 or IE7.
#navbar is to the left in both browsers.

I didn’t see it on the left. Maybe you have too many blank lines. Please use the original format to check!

It still doesn’t work. Can the guy upstairs leave a message on QQ to teach me?

In front of dtd ? html, the first line of the text...

TO Upstairs
I copied this paragraph in Dreamweaver, but it still doesn’t work.. Depressing.. .

charset=gb2312" changed to charset=utf-8"

Check whether your tags match and whether the writing is correct Correct, for example, the following nesting is wrong.

• sdahg


div>


sdahg







The child elements of

can only be

• body margin: 0px auto

  Uh... the problem is still not solved ..Read more books yourself first before asking questions. Thank you for your answers!

  #navbar ul li a {
  padding:0 5px 0 5px;
  height:30px;/*The specific value I wrote for you here, you can follow 100%*/
  float:left;
  text-decoration:none;
  background:#FFE1FF;
  color:black;
  line-height:1.5 em; This is your source code. In line-height; it is invalid if you enter a space for the unit. Just remove the space and change the value to 1.7em, and it will appear like this;
  #navbar ul {
  list-style-type:none;
  background:;
  width:200px;
  margin:0 auto;
  height:30px; Look at this, I fixed the width for you. ul is a block-level element, you give it the width and its parent The level elements are as big as each other. In the husband level, you only control the container inside, but not the content, unless you rearrange the layout of the ul; my early post may not be of use to you;