我正试图把一个ul和li放在里面。我认为问题是最后一个李的左边距。我尝试了两件事,但似乎没有影响。有什么问题?
CSS:
ul {
position:relative;
width: 640px;
margin:40px auto;
padding:0;
list-style-type:none;
}
ul li {
float:left;
position:relative;
width: 100px;
padding: 0px;
margin-right: 10px;
background-color: #f2f2f2;
display: block;
height: 30px;
line-height: 30px;
text-align:center;
font-family: verdana;
font-size:10px;
color: #666
}
ul li:last-child { margin-right: 0px; }
/* ul li.last-item { margin-right: 0px; } */
HTML:
<ul>
<li> first </li>
<li> second </li>
<li> third </li>
<li> fourth </li>
<li> fifth </li>
<li> sixth </li>
</ul>
我在这里生活:http://jsfiddle.net/a4aQN/
答案 0 :(得分:0)
这是适当的CSS:
ul {
margin: 40px auto;
list-style-type:none;
text-align: center;
}
ul li {
width: 100px;
padding: 0px;
margin-right: 10px;
background-color: #f2f2f2;
display: inline-block;
height: 30px;
line-height: 30px;
font-family: verdana;
font-size:10px;
color: #666
}
基本上我将text-align: center;
放在ul
上。您还有其他一些不需要的东西,例如设置宽度和float: left;
上的li
。