嵌套Div标签的放置问题

Question

我有以下Div层次结构：

<div id="DivTop">
    <div id="DivTopLeft" style="float: left; width: 45%; padding: 10px 10px 10px 10px;">
        Top left content.
    </div>
    <div id="DivTopRight" style="float: right; width: 45%; padding: 10px 10px 10px 10px;">
        Top right content.
    </div>
</div>
<div id="DivBottom" style="float: none;">
    <div id="DivBottomFinePrint" style="float: none; font-size: 8px; text-align: right;">
        Fine print content. This content appears between the `DivTopLeft` and `DivTopRight` divs.
    </div>
    <div id="DivBottomGridView">
        <asp:GridView ...>
    <div>
</div>

DivBottomFinePrint和DivTopLeft div之间显示DivTopRight的内容。此外，DivTop和DivBottom似乎具有相同的Y坐标，而我希望DivBottom在DivTop完成后垂直启动。我可以指定DivBottom的上边距，但这需要对我不想做的值进行硬编码。

有没有办法解决这个问题而不使用表？

Answer 1

您应该在容器中添加此样式：

#DivTop{
  clear:both;
}

浮动元素，向左或向右，这会在另一侧创建一个空白区域，允许其他元素占用剩余空间。