JS小提琴：https://jsfiddle.net/7p81bnto/2/
HTML：
<body>
<main>
<div>
<div style="
height: 50px;
width: 200px;
background-color: green;
float: right;
"></div>
<div style="
height: 50px;
width: 100%;
background-color: yellow;
display: table;
padding-top: 50px;
"></div>
</div>
</main>
</body>
在Firefox和Chrome中查看这些内容会提供不同的布局。 任何人都可以解释为什么会这样。我怀疑它与display：table属性有关，但我真的不明白为什么。
由于令人讨厌的原因，我无法移除显示：table，但我需要让下部div的主体在浮动div下面排成一行。 任何人都可以建议如何在两个浏览器中实现这一点吗？
答案 0 :(得分：0)
答案 1 :(得分：0)
事实证明{clear: both}也达到了正确的外观，我认为可以说是一个更好的解决方案（我的意思是，最终会使用CSS来更准确地反映我的设计需求。）