div下的div-不知道怎么做

Question

我的站点中有块，我想做一些类似的事情：http://s13.postimg.org/6ue9a8bfr/Untitled_3.png

但发生在我身上的是：http://s15.postimg.org/derz2m8h7/image.png

这是我的部门csS:

        background-color: #ffffff;
        width: 37.2%;
        border-top: 4px solid black;
        margin: 14px 0.4% 14px 0.4%;
        float: left;
        -webkit-border-radius: 2px;
        border-radius: 2px;

我该怎么做？

谢谢！

Answer 1

旧方法：

使用一个包含1行（tr）和3个单元格（td）的表，将DIV放在这些单元格中，确保单元格为valign=top。

避开餐桌布局方式的人：

使用3个表示列的容器DIV，将它们相对并排放置（float:）。

现代方式：

使用柔性盒定位https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Flexible_boxes或使用CSS列-*属性http://playground.html5rocks.com/#columns

Answer 2

使用三个单独的容器div来表示这三列。在设置了适当宽度的每一列中，将div放入容器中，并将它们分别设置为100%，从而填充列容器的整个宽度，迫使其他div元素位于下面。然后添加适当的边距。