以下div如何与CSS的以下方案对齐

Question

我有一个容器（boxContainer），在这个内部，我有六个其他的div，我正在尝试让它们看起来如下编辑CSS样式，但我只是找不到让它看起来像假装的方法...

<div id="boxContainer">
    <div id="box1"></div>
    <div id="box2"></div>
    <div id="box3"></div>
    <div id="box4"></div>
    <div id="box5"></div>
    <div id="box6"></div>
</div>

Answer 1

唯一的方法是遵循 请添加以下样式

#boxContainer #box1, #boxContainer #box5, #boxContainer #box6 {
    border: 1px dashed;
    display: inline-block;
    width: 100%;
}
#boxContainer #box2 {
    border: 1px dashed;
    float: left;
    height: 100px;
    width: 15%;
}
#boxContainer #box3, #boxContainer #box4 {
    border: 1px dashed;
    float: right;
    height: 50px;
    width: 85%;
}

希望这会有所帮助，可以更改额外的盒子高度我没有遵循确切的宽度/高度