像这样?我已将盒子更改为包装,但是将盒子类添加到每个盒子中.此外,我为每个框定义了一个宽度%,并添加了属性diplay:inline-block而不是float:left.
注意:请查看整页摘录
html,
body,
div {
box-sizing: border-box;
}
.wrap {
height: 500px;
border-style: solid;
border-width: 2px;
border-color: red;
text-align: center;
}
.box {
width: 25%;
height: 175px;
padding: 10px 10px 0 10px;
display: inline-block;
text-align: left;
margin-left: 20px;
margin-right: 20px;
}
Heading
Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.
Heading
Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.
Heading
Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.