0

在我的网站上，一个特定页面的徽标被向下轻推了几个像素，而在所有其他页面上却没有。所有页面的代码都是相同的（至少我认为是），所以我不确定是什么导致了问题。

这是工作与非工作的屏幕截图：

在职的：

在此处输入图像描述

非工作：

在此处输入图像描述

两者的代码如下所示，但是由于某种原因，其中一个页面无法正确呈现

<body>
<div class="wrapper"><?php include("include/header.php"); ?>

header.php：

<header id="header">
    <div id="logo">
        <h1 class="hidden">Welcome</h1>
    </div><!-- #logo -->

<?php include("getstageinfo.php");
switch ($currentStage)
{                       
case "0":

    $home ="period0.php";
break;

case "1":

    $home ="period1.php" ;

break;

case "2":

    $home ="period2.php" ;

break;

case "3":

    $home = "period3.php";

break;

}
?>
<nav id="nav">
    <h1 class="hidden">Main Navigation</h1>
    <a class="nav-item current" href="<?php echo $home ?>">HOME</a>
    <a class="nav-item" href="news.php">NEWS</a>
    <a class="nav-item" href="accounts.php">ACCOUNTS</a>
    <a class="nav-item" href="logout.php">LOG OUT</a>
    <div id="nav_edge">&nbsp;</div><!-- #nav_edge -->
</nav><!-- #nav -->
</header><!-- #header -->

CSS：

body { background-color: #031311; margin: 0px; padding: 0px; width: 100%; position: relative; background-image: url(../images/bg.jpg); background-repeat: no-repeat; background-position: center top; overflow-x:hidden; font-size: 14px; line-height: 1.6em; color: #2a2d32; }
#header { margin: 0px; padding: 0px; width: 100%; height: 350px; display: block; position: relative; overflow: hidden; }
#header #logo { background-image: url(../images/logo.png); background-repeat: no-repeat; background-position: center top; display: block; margin: 0px; padding: 0px; height: 450px; width: 100%; }
#header #nav { position: absolute; height: 50px; width: 455px; left: 50px; top: 298px; background-image: url(../images/nav_bg.png); background-repeat: repeat; background-position: left top; margin: 0px; padding: 0px; border-top-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: #8C9791; border-bottom-color: #8C9791; border-left-color: #8C9791; }
#header #nav .nav-item { font-size: 14px; line-height: 50px; color: #E1E7EA; display: inline-block; padding-top: 0px; padding-right: 10px; padding-bottom: 0px; padding-left: 15px; font-style: italic; margin-top: 0px; margin-right: 10px; margin-bottom: 0px; margin-left: 15px; text-shadow: 1px 1px 1px #000; }
#header #nav #nav_edge { background-image: url(../images/nav_edge.png); background-repeat: no-repeat; background-position: left top; display: block; margin: 0px; padding: 0px; height: 52px; width: 40px; position: absolute; top: -1px; right: -40px; }
#header #nav .nav-item:hover, #header #nav .nav-item:focus { color: #FFF; }
#header #nav .nav-item.current { color: #2BD5CC !important; }

这是生成的用于工作的html：

在此处输入图像描述

这是不工作的：

在此处输入图像描述

4

2 回答 2

0

用于 css 目的的 IE7 与 IE8 不同，它们都与 FIREFOX、CHROME 不同......

我没有看到您使用 IE7 指定 css 文件

<!--[if lte IE 7]>
<link href="/css/ie7.css" rel="stylesheet" type="text/css" />
<![endif]-->

您需要在页面中有 IE7 的备用 css

于 2012-02-03T11:03:19.573 回答
0

我意识到这与 include(); 我在声明文档类型之前使用的函数。所以我问了一个新问题。见下文

PHP include() 在 doctype 之前，导致一个空格

于 2012-02-06T11:52:17.673 回答