【发布时间】：2013-09-12 04:53:00
【问题描述】：
我正在创建一个网站，但它在不同浏览器中的显示方式存在问题。我正在使用 Chrome、iOS 和 IE8 进行测试。该站点在前两个中正确显示，但在 IE 中不正确。
有问题的网站是http://www.edalemill.co.uk/
谁能帮忙指出我的 CSS 有什么问题来解决问题？
谢谢！
【问题讨论】：
标签： html css internet-explorer-8 cross-browser compatibility
【发布时间】：2013-09-12 04:53:00
【问题描述】：
我已经看过并且可以复制这个问题。
我建议删除
overflow:auto; 来自#stripper
您还在 CSS 中多次使用 body，我建议您只使用一次并整理您的代码。
可能考虑将其用作对您有帮助的基础：
http://meyerweb.com/eric/tools/css/reset/
更新
否则为您的代码对 CSS 执行以下操作
#sidebar {
position:fixed;
}
我建议只编写 IE8 代码
【讨论】：
-
感谢您的建议。我已经删除了你提到的那一行，但它不会影响 IE 中元素的高度。它们仍然没有填充 100% 的浏览器视口。
-
@user2759205 所以我设法通过更改以下内容来使其工作，如更新中所示
-
@user2759205 如果这可行，请您将其标记为答案:)
-
虽然这会强制条形条变为 100%，但它会弄乱其他主要 div 的“内容” - 它会覆盖条形条？
-
抱歉，这行不通 - 请参阅 www.edalemill.co.uk/about-edale-mill.php 上的示例
如果您取出#container 上的height:100%，则背景图像会填满about page 的其余文本区域。
如果这有帮助，请告诉我。
更新
为滚动的内容区域添加另一个 CSS 标记可能会更容易。 height:100% 适用于那些不滚动的内容区域，但是，它们会破坏那些滚动的内容。我的建议，即使它可能不是最好的方法，是为滚动的内容区域制作第二个 CSS 标记，或者只是让图像更大。
【讨论】：
-
似乎有一些冲突的 CSS。如果您删除
#container上的height:100%，则它适用于“关于”，但不适用于“联系”。 -
感谢您的建议。现在离最佳解决方案不远了。您的建议至少在 IE 和 Chrome 中给出了一致的结果（即相同）。我现在需要做的就是弄清楚如何确保它们填充 100% 的高度，而不管内容如何
-
我不愿意在每个页面上使用不同的代码，因为页面是否需要滚动条取决于许多因素