<div style="float: right;">Right</div> <div style="clear: both; margin-top: 200px;">Main Data</div>
为什么margin:top“主数据”在上面的代码中不起作用?
margin:top
您可以将两个浮动div放入 另一个 设置为“溢出:隐藏”的div中:
<div style='overflow:hidden'> <div style="float: left;">Left</div> <div style="float: right;">Right</div> </div> <div style="clear: both; margin-top: 200px;">Main Data</div>
编辑 —为这个已有5年历史的答案添加一点点:我认为造成混乱的原因是_利润率下降的_ 过程有些复杂。使用OP中原始HTML的一个好技巧是添加一个CSS规则,如下所示:
div { border: 1px solid transparent; }
of!现在(没有我的额外要求<div>)可以正常工作!好吧,除了边界上的多余像素。特别是,我 认为 这是clear: both工作方式与边距折叠规则的结合,这些规则导致OP中代码的意外布局。
<div>
clear: both