css - 包装定位问题
问题描述:
我有一个包含几个div的包装。我想这个包装水平居中,我希望这个包装包装它的所有内容(高度自动)。在下面的“附加的”JSFiddle模板中,您将看到包装器包装其所有内容,但不是水平居中。如果我从包装中删除浮动属性,它将水平居中,但包装不会包装它的内容。希望有人能够帮助我将其集中和包装。预先感谢您的回复。干杯。马克。css - 包装定位问题
我的HTML:
<div id="wrapper">
<div id="column1" class="column">
<div id="contentOne" class="content">contentOne</div>
<div id="contentTwo" class="content">contentTwo</div>
</div>
<div id="column2" class="column">
<div id="contentThree" class="content">contentThree</div>
</div>
</div>
我的CSS:
#wrapper {
margin:10px auto;
width:430px;
float:left;
height:auto;
border:2px solid blue;
}
.content {
border:1px solid black;
background-color:yellow;
width:200px;
height:100px;
}
.column {
float: left;
}
#contentThree {
height: 130px;
}
答
更改#wrapper
CSS来:
#wrapper {
margin:10px auto;
width:430px;
height:auto;
border:2px solid blue;
overflow:hidden;
}
更新的jsfiddle:http://jsfiddle.net/xbcxs/2/
答
我前几天 我用了同样的问题:
top: 50%; position: absolute;
在包装css和它的工作对我来说很好。试试吧
非常感谢你stealhyninja。它工作得很好...... – Marc 2012-02-29 09:15:27