CSS居中一个float浮动元素的核心:
让最外面的层相对定位,left等于50%,然后内部嵌套层也使用相对定位且left设为-50%,这样的效果就是内层相对整行为水平居中;
#wrapper {
float: left;
position: relative;
text-align: left;
left: 50%;
}
#wrapper ul {
list-style: none;
position: relative;
left: -50%;
}
#wrapper ul li {
float: left;
position: relative; /* For IE6 */
}
<div id="wrapper">
<ul>
<li><a href="#">Button 1</a> </li>
<li><a href="#">Button 2's a bit longer</a> </li>
<li><a href="#">Butt 3</a> </li>
<li><a href="#">Button 4</a> </li>
</ul>
</div>
本文转自 涂根华 51CTO博客,原文链接:http://blog.51cto.com/tugenhua/772840,如需转载请自行联系原作者