css 如何让浮动DIV水平居中

时间:2015-11-14
对于定宽的非浮动元素我们可以用 margin:0 auto; 进行水平居中。对于不定宽的浮动元素我们也有一个常用的技巧解决它的水平居中问题。父元素和子元素同时左浮动，然后父元素相对左移动50%，再然后子元素相对右移动50%，或者子元素相对左移动-50%也就可以了。

实例如下：

<html>
<head>
<meta charset="UTF-8">
<title>css3对话框设计</title>
<style>
.box{
    float:left;
    position:relative;
    left:50%;
}
p{
    float:left;
    position:relative;
    right:50%;
}
</style>
</head>
<body>
<div class="box">
    <p>我是浮动的</p>
    <p>我也是居中的</p>
</div>
</body>
</html>
随机文章
WEB前端知识点必读
最近更新