HTML/CSS 将对象与浮动对齐

Question

所以我遇到了这个问题，我想将对象居中对齐，但这些对象有 float: left;

这是 100% 的样子

这是 150% 的样子

代码：

.holder {
text-align: center;
display: table;
margin: auto;
}

.box {
width: 360px;
height: 130px;
border-radius: 2px;
position: relative;
float: left;
margin-left: 10px;
margin-top: 10px;
}

HTML代码：

<div class="holder">
<div class="box">
</div>
<div class="box">
</div>
<div class="box">
</div>
</div>

Answer 1

如果你使用 float:left 它会忽略 属性 text-align:center 所以你可以使用 display:inline-block 而不是 float:left 它会完美地工作。

试一次！