我对以下代码和与 IE8 的兼容性有疑问（原始代码更复杂，但这显示了问题的核心）
Protected Sub btnExpand_Click(sender As Object, e As System.EventArgs)
If btnExpand.Text = "Expand" Then
btnExpand.Text = "Collapse"
lblContent.Text = "XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX"
Else
btnExpand.Text = "Expand"
lblContent.Text = "Content"
End If
End Sub
<style type="text/css">
div {padding:10px; margin:20px;}
.Section {width:550px;}
.ClearBoth {clear:both; padding:0px; width:490px; margin:0px;}
</style>
<div>
<div class="Section" style="float:left; background-color:Green;"></div>
<div class="Section" style="float:Right; background-color:Blue;">
<div style="background-color:Yellow;"></div>
<div style="background-color:Red; display:inline-block; float:right;">
<div style="background-color:Orange; display:inline-block;">
<asp:Button ID="btnExpand" runat="server" Text="Expand" onclick="btnExpand_Click" />
<br />
<asp:Label ID="lblContent" runat="server" Text="Content"></asp:Label>
</div>
<div class="ClearBoth"></div>
</div>
<div class="ClearBoth"></div>
<div style="background-color:Fuchsia;"></div>
</div>
</div>
用户点击“展开”按钮，更多信息显示在橙色 DIV 中（注意：橙色 DIV 实际上是不可见的，在本例中我们关心的是红色 DIV）
在实际代码中，单击“展开”按钮会在网格视图中取消隐藏大约 10 列，在此示例中，我们只是将大量 X 放入标签中，但结果是相同的。
红色 DIV 展开（向左）以显示现在可见的内容。
我使用 Chrome 作为我的默认浏览器创建了此代码，此代码在我的备用浏览器 (IE10) 中也可以正常工作，但是此代码在我们公司的浏览器 (IE8) 中不起作用
在 IE8 中，无论红色 DIV 是否设置为 float:right，橙色和红色 DIV 都会扩展到蓝色父 DIV 的右侧。
考虑到这在 Chrome 和 IE10 中有效，我假设我的代码在“开发时间”和转发中的这一刻是正确的，但有人知道有什么方法可以让它在 IE8 上工作吗？昨天我花了 4 个小时阅读有关浮动和显示的 W3C 文档，并在这里和谷歌搜索。