1

对不起所有的代码。这真的是一个非常基本的页面。我难住了。IE 8 似乎显示此页面与 ff 14 不同。例如在 ie8 中，标题中的文本似乎相对于它包含的 div 放置。在 ff 14 中，文本似乎相对于“换行”div 的角放置。这里有一些imagur图片

ie8 http://i.imgur.com/TkgCc.jpg

ff14 http://i.imgur.com/ykdi9.jpg

更糟糕的是，我的办公室同事说他使用的是 ie8，而页面在他看来就像我的 ff14 示例。我刚刚安装了ie8，所以它应该是一个全新的安装。

ie8 版本在直觉上似乎是正确的。我的意思是你会认为文本会相对于它包含的 div 定位自己。

有任何想法吗？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>title</title>
<STYLE TYPE="text/css" MEDIA=screen>
body
{
    font-family: Georgia, serif;
}
#wrap
{
    width: 900px;
    margin: 30px auto;
}
#left-block
{
    float: left;
    height: 700px;
    width: 140px;
    background-color: #FFF;
    border: 2px solid #000;
    padding: 20px 0px 0px 20px;
    font-size:14px;
}
#left-block h1
{
    margin: 0 0 30px 0;
    padding: 0 0 0 0;
}
#left-block p
{
    font-weight:900;
}
#left-block li
{
    padding: 10px 0 0 0;
}
#header
{
    height: 120px;
    padding: 10px 0px 0px 0px;
}
#header h2
{
    font-size: 25px;
    margin: 0px 0px 0px 90px;
}
#header h1
{
    font-size: 65px;
    margin: 0px 0px 0px 220px;
}
#nav
{
    height: 30px;
    background-color: #000;
    margin-bottom: 10px;
}
#nav ul
{
    margin: 0;
    padding: 0px 0px 0px 190px;
}
#nav ul li
{
    list-style-type: none;
    display: inline;
}
#nav li a
{
    display: block;
    float: left;
    padding: 5px 10px;
    color: #fff;
    text-decoration: none;
    border-right: 1px solid #fff;
    border-left: 1px solid #fff;
}
#nav li a:hover { background: #666; }
#main
{
    height: 500px;
    background-color: #FFF;
    border-bottom: 3px solid #000 ;
}
#table
{
    margin: 20px 0px 0px 190px;
}
#footer
{
    text-align: center;
}
#footer h1
{
    font-size: 14px;
    margin: 20px 0 0 0;
}
</STYLE>
</head>
<body>
<div id="wrap">
    <div id="left-block">
        lb
    </div>
    <div id="right-block">
        <div id="header">
            <h2>hd</h2>
        </div>
        <div id="nav">
            nav
        </div>
        <div id="main">
            mn
            <div id="table">
                tb
            </div>
        </div>
        <div id="footer">
            ft
        </div>
    </div>
</div>
</body>
</html>
4

1 回答 1

2

猜测一下，您的浏览器正在进入兼容模式。在 IE 中按 F12，它会在右侧 Web 开发区顶部的灰色条上告诉您您的模式。

要阻止这种情况发生，请将其添加到您的<head>区域：

<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />

如果安装在客户端计算机上，这将强制 IE 使用可用的最新模式并打开 Chrome 框架。

于 2012-08-08T16:10:58.847 回答