IE 9 中的布局损坏答案

【问题标题】：Broken layout in IE 9IE 9 中的布局损坏
【发布时间】：2011-05-08 08:39:17
【问题描述】：

我有一个带有各种布局面板的 gwt 应用程序。我的布局适用于除 IE9 之外的所有浏览器。布局完全被打破。文本出现在任何地方，页面底部的图像或仅显示 3/4 等。我已经使用最新版本的 gwt 2.3 重新编译了我的应用程序，但它没有改变任何东西。有什么建议么？提前致谢。这是背景破损的图像：

【问题讨论】：

尝试在 validator.w3.org 上验证您的页面，有时 ie 对不正确的 html 的容忍度低于其他浏览器
IE9 是否以“IE9 模式”加载页面？另外，当您说“除 IE9 之外的所有浏览器”时，是否包括其他 IE 版本？您的页面是否处于“标准模式”？
页面无法在标准模式下加载。是的，在 ie8 和 7 中，该应用运行良好。
The GWT 2.0 layout system is intended to work only in "standards mode" - 这意味着：要么使用带有“标准模式”的 GWT 2.0+ LayoutPanel（例如 DockLayoutPanel），要么使用带有“怪癖模式”的旧面板（例如 DockPanel）。 // 有时你可以不遵守这条规则而侥幸，但尤其是 IE，它经常无法正常工作。
问题可能是我在屏幕截图中的面板是水平面板，在标准模式下不能很好地工作。我通过使用 FlowPanel 并将 float: auto 添加到其子项尝试了 google 提供的替代方案，但这并不能真正解决问题。

【解决方案1】：

很奇怪，在 IE9 中有些东西坏了，而在其他浏览器中却没有。

试试这个：

-更正 IE9 和其他目标浏览器的问题 - 然后看看在其他浏览器中你是否继续看到一切正常（可能你会遇到 IE6 和 IE7 的问题，所以我要做的就是用 hack 修复它们）

所以我建议使用最高版本的浏览器，然后修复旧版本。反过来做...=)

如果这对你没有帮助，你能附上一些代码吗？

【讨论】：

【解决方案2】：

解决您的问题的方法可能是将“X-UA-Compatible”元标记添加到您的 HTML 以告诉 IE 以不同的模式呈现。例如，告诉 IE9 始终以 IE8 模式呈现：

<meta http-equiv="X-UA-Compatible" content="IE=8" />

关于这个元标签有many useful articles

【讨论】：