0

可能重复：
IE9 Float with Overflow:Hidden 和 Table Width 100% 无法正确显示

与 Chrome 相比，我正在设计的网页在 IE9 中被压扁了。这不仅仅是字体，它是页面的宽度和一切。布局是一样的。我查看了其他几个网站，它们在两种浏览器中看起来都一样。因此，我认为这不是浏览器设置问题。两种浏览器都设置为 100% 缩放。我在页面的 CSS 中指定宽度和字体大小。而且，当我检查浏览器中的 Inspect 元素时，实际上，它们都告诉我它是 Times New Roman 15 像素，宽度是 900 像素。但是这对两者都不是真的。我在本地主机上运行。

我该如何解决这个问题，以便我知道我在设计什么？

编辑：

在标题中（现在）：

<!DOCTYPE html>
    <html>
    <head>
      <meta http-equiv="X-UA-Compatible" content="IE=edge" />

CSS：

 body{font-family:"Times New Roman";font-size:15px} 
.container{width: 900px; height:100%; margin-left:auto; margin-right:auto;  overflow: hidden; min-height: 700px;}
.header{padding:30px;}
.naviagte{}
.left_column{float:left; width:100px; padding-bottom: 100000px; margin-bottom: -100000px; }
.main_body{float:left; width:700px; min-height: 700px; padding-bottom: 100000px; margin-bottom: -100000px;}
.right_column{float:left; background:green;width:100px; padding-bottom: 100000px; margin-bottom: -100000px;}
.footer{}
.clear{clear:both}

HTML：

<div class = "container">
    <div class = "header">My website and stuff</div>
    <div class = "navigate">
      stuff here
    </div>
    <div class = "left_column">&nbsp;</div>
    <div class = "main_body">
       stuff here
    </div>
    <div class = "right_column">&nbsp;</div>
    <div class = "clear"></div>
    <div class = "footer">&nbsp;</div>
</div>
4

1 回答 1

0

这通常是由于标题错误。试试这个：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />

请注意这两个设置：第二个设置并不总是需要，但对于某些边缘情况（例如浮动行为），它会使 IE 像其他浏览器一样工作。

编辑 ：

不要使用像 100000px 这样的值来填充或边距！这可能会引发整数溢出错误。你的问题很可能在这里。

于 2012-10-14T15:52:21.537 回答