我有
- <div id="container">
- <ul>
- <li>Item 1</li>
- <li>Item 2</li>
- <li>Item 3</li>
- </ul>
- </div>
使用以下CSS:
- #container li {
- float:left;
- height:33px;
- line-height:30px;
- text-align:center;
- width:auto;
- }
- #container{
- width:600px;
- }
但是我很难将#container中的ul水平居中.看来我需要在ul上设置一个固定宽度的边距:0自动工作(需要text-align:IE中心).但是我不想为ul设置固定宽度,因为li项目是动态的.
请指教.
解决方法
- #container {
- width: 600px;
- text-align: center;
- }
- #container ul {
- display: inline-block;
- }
- #container li {
- float: left;
- height: 33px;
- line-height: 30px;
- }