Question

我在下一页上遇到了DIV布局的跨浏览器问题：

我在两个div周围创建了一个边框，以便于识别。

似乎IE9正在内部DIV中正确嵌套内部DIV，而Firefox正在以不同方式分离div。我正在使用“作弊”标签，以便将div对齐到中心，但我在没有这些标签的情况下进行测试，浏览器仍然以不同的方式呈现它们。

有问题的div位于我的评论栏下：

我知道你们很聪明，我正在寻求你们的帮助！谢谢，Rob

Answer 1

你需要通过添加类似：<br clear="all"/>或<div style="clear:both; height:0;"></div>的内容来清除浮动的div，并为父div添加一个宽度，这应该可以修复它。

更多信息：基于浮动的布局的一个常见问题是浮动的容器不希望伸展以容纳浮动。如果你想在所有花车周围添加一个边框（例如，容器周围的边框），你必须以某种方式命令浏览器一直拉伸容器。

e.g。

<div class="parent">
  <div style="float:left"></div>
  <div style="float:left"></div>
  <div style="float:left"></div>
  <br clear="all"/>
</div>