我正在尝试为某人制作一个非常简单的网站（不是为了钱），但我无法让导航菜单在 IE7 中工作。这是基于模板的。
在 IE8 / chrome 中正确显示。
在 IE7 中，首先显示导航菜单项，然后没有其他内容。
任何建议，将不胜感激。
样式.css：
body {
margin: 0;
padding: 0;
background: #0048B3 url(images/img01.png) repeat;
font-family: Tahoma, Geneva, sans-serif;
font-size: 13px;
color: #626262;
}
h1, h2, h3 {
margin: 0;
padding: 0;
text-transform: lowercase;
font-family: 'Oswald', sans-serif;
font-weight: 300;
color: #7D7764;
}
h1 {
font-size: 2em;
}
h2 {
font-size: 2.8em;
}
h3 {
font-size: 1.6em;
}
p, ul, ol {
margin-top: 0;
line-height: 180%;
}
ul, ol {
}
a {
text-decoration: none;
color: #731F1F;
}
a:hover {
}
#wrapper {
overflow: hidden;
background: #FFFFFF url(images/img02.png) repeat-x left top;
}
.container {
width: 1200px;
margin: 0px auto;
}
/* Header */
#header-wrapper {
overflow: hidden;
height: 600px;
}
#header {
width: 1200px;
height: 620px;
margin: 0 auto;
background: url(images/img04.jpg) no-repeat right top;
}
/* Logo */
#logo {
overflow: hidden;
font-family: 'Oswald', sans-serif;
}
#logo h1, #logo p {
text-shadow: 1px 1px 0px #5E8CC3;
text-transform: uppercase;
}
#logo h1 {
padding: 200px 0px 0px 0px;
letter-spacing: -1px;
font-size: 100px;
}
#logo p {
margin-top: -20px;
padding: 0px 0px 0px 5px;
font-size: 20px;
font-weight: 300;
color: #B8D1EE;
}
#logo p a {
color: #696969;
}
#logo a {
border: none;
background: none;
text-decoration: none;
color: #FFFFFF;
}
/* Menu */
#menu-wrapper {
overflow: hidden;
height: 80px;
}
#menu {
overflow: hidden;
height: 80px;
background: url(images/img03.jpg) repeat-x left top;
}
#menu ul {
margin: 0;
padding: 0px 0px 0px 0px;
list-style: none;
line-height: normal;
font-family: 'Oswald', sans-serif;
}
#menu li {
display: inline-block;
border-right: 1px solid #64DAFE;
}
#menu a {
display: block;
height: 80px;
margin: 0px;
padding: 0px 30px;
line-height: 80px;
text-decoration: none;
text-transform: lowercase;
text-transform: uppercase;
font-size: 20px;
font-weight: 300;
color: #FFFFFF;
border: none;
}
#menu a:hover, #menu .current_page_item a {
background: url(images/img06.png) repeat-x left top;
text-decoration: none;
color: #FFFFFF;
}
#menu .current_page_item a {
}
/* Page */
#page {
overflow: hidden;
padding: 50px 0px 40px 0px;
}
/* Content */
#content {
float: left;
width: 800px;
margin-right: 24px;
padding: 0px 0px 0px 0px;
}
#content h2 {
padding: 0px 0px 20px 0px;
text-transform: uppercase;
font-size: 3em;
font-weight: 200;
color: #262626;
}
/* Sidebar */
#sidebar1 {
float: left;
width: 256px;
margin: 0px;
padding: 0px 0px 0px 0px;
color: #787878;
}
#sidebar1 h2 {
padding: 0px 0px 20px 0px;
text-transform: uppercase;
font-size: 1.5em;
font-weight: 200;
color: #262626;
}
/* Three Column Footer Content */
#footer-bg {
overflow: hidden;
padding: 50px 0px;
}
#footer-content {
text-shadow: 1px 1px 1px #003E93;
color: #67C8E3;
}
#footer-content h2 {
margin: 0px;
padding: 0px 0px 20px 0px;
letter-spacing: 1px;
text-transform: uppercase;
font-size: 20px;
font-weight: 200;
color: #FFFFFF;
}
#footer-content a {
color: #56C8E3;
}
#footer-content a:hover {
text-decoration: underline;
}
#column1 {
float: left;
width: 280px;
margin-right: 30px;
}
#column1 p {
line-height: 1;
}
#column2 {
float: left;
width: 280px;
margin-right: 30px;
}
#column3 {
float: left;
width: 280px;
}
#column4 {
float: right;
width: 260px;
}
/* Footer */
#footer {
height: 100px;
margin: 0 auto;
padding: 50px 0px 0px 0px;
background: url(images/img04.png) no-repeat center top;
}
#footer p {
margin: 0;
padding-top: 10px;
line-height: normal;
text-align: center;
color: #C59C9C;
}
#footer a {
color: #C59C9C;
}
#marketing {
overflow: hidden;
margin-bottom: 30px;
padding: 20px 0px 10px 0px;
border-top: 1px solid #E3E3E3;
border-bottom: 1px solid #E3E3E3;
}
#marketing .text1 {
float: left;
margin: 0px;
padding: 0px;
letter-spacing: -2px;
text-transform: lowercase;
font-size: 34px;
color: #345E9B;
}
#marketing .text2 {
float: right;
}
#marketing .text2 a {
display: block;
width: 252px;
height: 38px;
padding: 15px 0px 0px 0px;
background: url(images/img07.jpg) no-repeat left top;
letter-spacing: -2px;
text-align: center;
text-transform: lowercase;
font-size: 30px;
color: #FFFFFF;
}
.box1 {
overflow: hidden;
height: 300px;
background: url(images/img04.jpg) no-repeat center bottom;
}
.list-style1 {
margin: 0px;
padding: 0px;
list-style: none;
}
.list-style1 li {
padding: 7px 0px 7px 0px;
border-top: 1px dashed #E7E2DC;
}
.list-style1 .first {
padding-top: 0px;
border-top: none;
}
.list-style2 {
margin: 0px;
padding: 0px;
list-style: none;
}
.list-style2 li {
padding: 5px 0px 5px 0px;
border-top: 1px solid #EEEEEE;
}
.list-style2 a {
padding-left: 15px;
background: url(images/img10.png) no-repeat left 50%;
color: #717171;
}
.list-style2 a:hover {
text-decoration: underline;
color: #606060;
}
.list-style2 .first {
padding-top: 0px;
border: none;
}
.list-style3 {
margin: 0px;
padding: 0px;
list-style: none;
}
.list-style3 li {
padding: 5px 0px 5px 0px;
background: url(images/img12.jpg) repeat-x left top;
}
.list-style3 a {
padding-left: 15px;
background: url(images/img13.jpg) no-repeat left 50%;
color: #717171;
}
.list-style3 a:hover {
text-decoration: underline;
color: #606060;
}
.list-style3 .first {
padding-top: 0px;
background: none;
border: none;
}
/* Three Column Content */
#four-column {
overflow: hidden;
padding: 30px 0px 30px 0px;
border-top: 1px solid #EEEEEE;
text-shadow: 1px 1px 0px #FFFFFF;
color: #626262;
}
#four-column #tbox1 {
float: left;
width: 282px;
margin-right: 24px;
}
#four-column #tbox2 {
float: left;
width: 282px;
margin-right: 24px;
}
#four-column #tbox3 {
float: left;
width: 282px;
}
#four-column #tbox4 {
float: right;
width: 282px;
}
.box-style {
background: #191919 url(images/img05.jpg) repeat;
}
.box-style h2 {
padding: 10px 0px;
letter-spacing: -1px;
text-transform: uppercase;
font-size: 20px;
font-weight: 200;
color: #515151;
}
.box-style .image {
width: 320px;
}
.box-style .arrow {
background: url(images/img06.png) no-repeat right top;
}
.box-style .content {
overflow: hidden;
padding: 30px;
}
.divider {
overflow: hidden;
height: 50px;
background: url(images/img04.png) no-repeat center top;
}
索引.html：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!--
Design by Free CSS Templates
http://www.freecsstemplates.org
Released for free under a Creative Commons Attribution 2.5 License
Name : Open-Air
Description: A two-column, fixed-width design with dark color scheme.
Version : 1.0
Released : 20120818
-->
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="keywords" content="210 Social Club" />
<meta name="description" content="210 Social Club" />
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>210 Social Club</title>
<link href="http://fonts.googleapis.com/css?family=Oswald:400,300" rel="stylesheet" type="text/css" />
<link href="style.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>
<div id="wrapper">
<div id="menu-wrapper">
<div id="menu" class="container">
<ul>
<li class="current_page_item"><a href="#">Homepage</a></li>
<li><a href="Newsletter/newsletter.htm">Newsletter</a></li>
<li><a href="piwigo/">Photos</a></li>
<li><a href="private/contacts.html">Contacts</a></li>
</ul>
</div>
</div>
<div id="header">
<div id="logo" class="container">
<h1><a href="#">210 Social Club</a></h1>
</div>
</div>
<div id="page" class="container">
<div id="content">
<h2 align=center>Welcome to the 210 Social Club webpage.</h2>
<h2 align=center>Club Purpose:</h2>
<div class="entry">
<H3><p>The following is the purpose for which the club has been organized: To create, foster and cultivate a fraternally cooperative spirit among it's members so as to further true and sincere friendship in all it's aspects; to encourage and stimulate interest for the help of our fellow man and the pure social enjoyment for the members and their families; to include physical and athletic recreation for all.</p></H3>
</div>
</div>
<!-- end #content -->
<div id="sidebar1">
<div>
<img src="images/img11.jpg" alt="club logo"/>
</div>
</div>
<!-- end #sidebar -->
</div>
<!-- end #page -->
</div>
</body>
</html>