IE7 中奇怪的 CSS 问题答案

【问题标题】：Weird CSS issue in IE7IE7 中奇怪的 CSS 问题
【发布时间】：2009-09-09 16:29:09
【问题描述】：

我在 Internet Explorer 7 中遇到了一个罕见的 CSS 问题（我实际上是在 IE8 的兼容性视图中对其进行测试，但客户端也向我发送了原生 IE7 中的屏幕截图），很容易重现：

我一直在四处寻找 IE7 错误，并尝试使用宽度、边框和其他 CSS 属性，但没有成功。欢迎任何意见！

【问题讨论】：

【解决方案1】：

我发现如果您应用以下样式，当您单击它附近的任何位置时，它似乎会阻止它中断：

#prevparties_middlerow
{
    float:left;
    width:150px;
}

不过，如果可以的话，有一个小建议，而不是在面板中的内容的任一侧使用 div 来创建这样的边框：

<div id="prevparties_left"/>
<div id="prevparties_contentBox">
     content
</div>
<div id="prevparties_right" class="boxmiddle"/>

您可能会发现将内容框包装在将边框设置为背景的 div 中要容易得多，如下所示：

<div id="prevparties_contentWrap">
    <div id="prevparties_contentBox">
         content
    </div>
</div>

这里的主要优点是包装 div 会随着包含 div 的下降而下降，因此您不必对所有这些边框 div 应用特定的高度。当东西像这样包装时，我发现它破裂的可能性要小得多：D

无论如何，希望这会有所帮助。

【讨论】：

非常感谢，完美运行！也感谢您的建议，我知道此时的 CSS 非常糟糕，这是因为边框的代码是由 jQuery 插件（glassbox-js.com）自动生成的，但是页面在 JS 插件之间存在一些兼容性问题，所以我抓取了 GlassBox 呈现的代码并将其“硬编码”到 CSS 文件中。我并不为此感到自豪，但当时完成了工作并且客户很高兴。