タイトルにあるように、IEでは画像が2回表示されますが、他のブラウザでは完全に表示されます。奇妙なことに、5ページのうち2ページで間違って表示されます。コードはすべて同じですが。
重要なのは、両方のナビゲーション部分のhtmlコードがまったく同じであり、同じcssファイルから画像を取得することです。
誰かが何が間違っている可能性があるかを確認できますか?
CSS:
a img
{
border:none;
}
body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #7f7e7e;
margin: 0px;
padding: 0px;
background-color: #ffffff
background-image: url(images/#####.pg);
background-repeat: repeat-x
}
#container {
width: 1200px;
margin: auto;
overflow: hidden;
}
#header {
width: 1200px;
height: 130px;
}
#logo {
background-image: url(../images/logo.png);
background-repeat: no-repeat;
width: 425px;
height: 87px;
margin-top: 28px;
margin-left: 128px;
float: left;
}
#logo_des {
background-image: url(../images/logo2.png);
background-repeat: no-repeat;
width: 311px;
height: 57px;
float: right;
margin-top: 57px;
margin-right: 37px;
}
.nav_menu li {
list-style: none;
display: inline;
margin-left: 159px;
line-height: 40px;
}
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head> <title> x</title>
<link href = "styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
<a name="top">
<div id="container"> <!-- BEGIN CONTAINER -->
<div id="header"> <!--BEGIN HEADER -->
<div id="logo"><!-- BEGIN LOGO -->
</div><!-- END LOGO -->
<div id="logo_des"> <!-- BEGIN LOGO DESCRIPTION -->
</div> <!--END LOGO DESCRIPTION -->
</div> <!--END HEADER-->
<div id="navigation_line"> <!-- BEGIN NAVIGATION_LINE -->
<div id="menu"> <!--BEGIN MENU-->
<ul class="nav_menu">
<li><a href="index.html">Home</a></li>
<li><a href="about_x.html">About x</a></li>
<li><a href="our_services.html">Our Services</a></li>
<li><a href="contact_us.html">Contact Us</a></li>
<li><a href="partners.html">Partners</a></li>
</ul>
</div> <!-- END NAVIGATION_LINE -->
</div> <!--END MENU--> `