1

我有一个非常简单的布局，在 Ie 中看起来不正确。我已经搞砸了 Firebug Lite 和 IE 开发人员工具栏，但似乎无法归结为什么在这种情况下右图像会包裹在左图像下方。这是我为调试目的而简化的问题的链接。 http://tunetra.de/test/layout.html

我还将在下面传递我的 HTML。

<html>
<head>
<style>
#container
{
    margin: 0px auto;
    width: 1000px;
    background: #fff;
}

#main
{
  text-align: left;
}
</style>
</head>
<body style="text-align:center;">
  <div id="container">
    <div id="header">
      <img src="img/left_image.png" style="width: 272px; height: 90px; float: left;position: relative;"> 
      <div style="float: right;position: relative;background-color: #fff;width: 728px;height: 90px;">
      <img src="img/right_image.png" style="">
    </div>
  </div>     
  <div id="main">
    Lorem Ipsum Bla<br/> Bla<br/> Bla
  </div>
</div>
</body>
</html>
4

1 回答 1

5

默认情况下，您的页面在 Internet Explorer 10 中运行良好。不过，我确实看到了您在 Internet Explorer 9 中提到的问题。这是由于您在 Quirks 模式下加载页面造成的。插入以下 Doctype 以更正此问题：

<!DOCTYPE html>

将其<html>放在第一行之前。这解决了您的问题。

您可以通过使用 F12 开发人员工具将您的页面置于标准模式来快速测试这一点。按键盘上的 F12 以显示开发人员工具。在右上角，单击“文档模式：怪癖模式”并将其更改为“Internet Explorer 9 标准”。

于 2013-03-09T03:53:50.653 回答