博客统计信息

51cto推荐博客
用户名:涂根华
文章数:60
评论数:52
访问量:25737
无忧币:638
博客积分:1172
博客等级:5
注册日期:2011-11-12

CSS如何居中一个float浮动元素?
2012-02-05 11:20:41
原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 、作者信息和本声明。否则将追究法律责任。http://tugenhua.blog.51cto.com/3912301/772840

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>

本文出自 “涂根华前端博客” 博客,请务必保留此出处http://tugenhua.blog.51cto.com/3912301/772840

分享至
更多
一键收藏,随时查看,分享好友!
0人
了这篇文章
类别:HTML/CSS技术圈()┆阅读()┆评论() ┆ 推送到技术圈返回首页

文章评论

 
 

发表评论            

【技术门诊】专家解析:软考重点难点及应试技巧
昵  称:
登录  快速注册
验证码:

请点击后输入验证码博客过2级,无需填写验证码

内  容: