Question

CSS如何让导航条颜色通栏ul中的元素居中

通过CSS设置，黑色通栏，但是UL要居中
例如这种效果

<div id="menu2" class="menu">
<ul>
<li><a href="#">首　　页</a></li>
<li><a href="#">企业文化</a></li>
<li><a href="#">产品展示</a></li>
<li><a href="#">新闻中心</a></li>
<li><a href="#">阳光服务</a></li>
<li><a href="#">加盟代理</a></li>
<li><a href="#">在线咨询</a></li>
</ul>
<div class="cls"></div>
</div>
CSS代码：
.menu {
height: 40px;
display: block;
padding: 0px;
width: 800px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 40px;
margin-left: auto;
}

.menu ul {
list-style: none;
padding: 0;
margin: 0;
}

.menu ul li {
/* width and height of the menu items */
float: left;
overflow: hidden;
position: relative;
line-height: 40px;
text-align: center;
}

.menu ul li a {
/* must be postioned relative */
position: relative;
display: block;
width: 90px;
height: 40px;
font-family: "微软雅黑", "宋体";
font-size: 12px;
text-decoration: none;
cursor: pointer;
}

.menu ul li a span {
/* all layers will be absolute positioned */
position: absolute;
left: 0;
width: 90px;
}

.menu ul li a span.out {
top: 0px;
}

.menu ul li a span.over,
.menu ul li a span.bg {
/* hide */
top: -40px;
}

/** 2nd example **/

#menu2 {
background: #000;
}

#menu2 ul li a {
color: #999999;
}

#menu2 ul li a span.over {
color: #000;
background-color: #f0f0f0;
}
源代码可以在这里下载：http://www.16sucai.com/2011/02/4722.html
求大神指教，谢谢！





Answer 1

我怎么总觉得你写错了，还有你的ul li css样式写得好复杂啊！你的导航条<div class="cls"></div> 和ul起到的是平级作用吧!所以他才不会在你下面的<div class="cls"></div>里起到任何作用，你可以试一下把ul li加到<div class="cls"></div>里面去定义看看。

<div id="menu">
<div class="cls">
<ul>
<li><./li>
</ul>
</div>
</div>

Answer 2

拿源码第一例说：#menu1{text-align:center;} #menu1 ul{display:inline-block; *display:inline; *zoom:1;}这样就可以实现LI float后在DIV层中居中的问题了。