在 IE 8 中清除浮动答案

【问题标题】：Clear float in IE 8在 IE 8 中清除浮动
【发布时间】：2009-12-30 16:36:34
【问题描述】：

我正在尝试在 .NET MVC 中构建一个页面（这并不重要），其中一个 div 使用浮点数分为左右容器。当我尝试使用除<b> 标签（例如<div> 或<br>）以外的任何东西来清除浮动时，IE8 将无法正确呈现页面（就好像它忽略了标签中的样式一样）。如果我使用<b> 标签，Chrome 和 Firefox 无法正确呈现页面。我已经检查了我的 HTML 以确保我没有任何杂散标签并通过 W3C 标记验证器运行它并且它通过了严格的 XHTML 1.0。我对这里可能发生的事情感到茫然。我意识到有更好的方法来清除浮动（例如使用 :after 伪元素），但我需要一些简单而干净的东西。我想知道是否有人知道可能导致这种情况发生的原因，也许是样式表中的某些内容？提前感谢您的帮助。

【问题讨论】：

请发布 SSCCE (sscce.org)。重现并准确呈现您遇到的问题所需的最低要求（和有效）HTML/CSS。

标签： css internet-explorer-8 css-float

【解决方案1】：

我找到了。愚蠢的IE。我必须将容纳两个浮动容器的 div 的高度设置为 100%。我猜 Mozilla 和 Chrome 假设 100% 的高度，而 IE 没有。我应该更明确一点。问题是当我使用 DIV 标签清除浮动时，我的容器中没有显示任何内容，或者背景颜色不会填充。我必须安装 IE 开发工具栏才能弄清楚发生了什么。

<div id="floatcontainer" style="width:100; height:100%;">

<div id="floatleft" style="float:left; width:50%; background-color:#454545;"></div>
<div id="floatright" style="float:right; width:50%;"></div>
<div id="clear" style="clear:both;"></div>

</div>

【讨论】：

【解决方案2】：

试试 clearfix 方法：http://www.positioniseverything.net/easyclearing.html

【讨论】：

【解决方案3】：

jimbo，我建议使用类而不是 id，并在样式表中包含所有样式。这也应该很好地说明浮动和清除http://goo.gl/uxu8G

【讨论】：