2
我一直在为我当前的Web开发类中期网站工作，并遇到一个问题，我一直没能找到解决方案。 IE11（可能更早的版本）似乎不喜欢我的布局，我不知道为什么。在Firefox和Chrome中一切都很好。这是链接：http://auharvey.com/1510/midterm/index.htmlCSS布局完全搞砸了IE 11
任何帮助将不胜感激！
#wrapper {
\t width: 800px;
\t margin-left: auto;
\t margin-right: auto;
\t background-color: #855321;
\t }
\t
body {
\t background-color: #e6c6a6;
\t font-family: calibri, sans-serif;
\t }
header, nav, main, footer {
\t display: block;
\t } \t
\t
/* a:link {
\t color: #855321;
\t }
\t
a:hover {
\t color: #4c9860;
\t }
\t
a:visited {
\t color: #855321;
\t }
\t */
header {
\t background-color: #cc9966;
\t border: 3px solid #855321;
\t margin: 0;
\t padding: 0 10px;
\t
\t }
\t
nav {
\t margin: 0;
\t padding: 0;
\t height: 24px;
\t border: 3px solid #855321;
\t
\t }
nav ul {
\t list-style-type: none;
\t
\t padding: 0;
\t margin: 0;
\t }
\t \t
nav li {
\t display: inline;
\t margin: 0;
\t padding: 0;
\t }
\t
nav a {
\t display:inline-block;
\t width: 262px;
\t height: 24px;
\t background-color: #cc9966;
\t color: #855321;
\t text-align: center;
\t text-decoration: none;
\t text-transform: uppercase;
\t line-height: 24px;
\t font-weight: bold;
\t margin: 0;
\t padding: 0;
\t }
\t
nav a:hover {
\t background-color: #4c9860;
\t color: #855321;
\t }
\t
nav a:visited {
\t color: #855321;
\t }
\t
#container {
\t width: 800px;
\t background-color: #ff0000;
\t }
\t
main {
\t display: block;
\t min-height: 290px;
\t background-color: #cc9966;
\t border: 3px solid #855321;
\t margin: 0;
\t padding: 0 10px;
\t }
\t
#main-right {
\t float: right;
\t width: 374px;
\t min-height: 290px;
\t background-color: #cc9966;
\t border: 3px solid #855321;
\t margin: 0;
\t padding: 0 10px;
\t }
.highlight {
\t background-color: #4c9860;
\t font-weight: bold;
\t font-style: italic;
\t }
.float-left {
\t float: left;
\t width: 374px;
\t }
\t
.float-right {
\t float: right;
\t padding: 0;
\t margin: 10px 5px 10px 10px;
\t }
\t
ul {
\t list-style-type: square;
\t line-height: 150%;
\t }
\t
footer {
\t clear: both;
\t background-color: #cc9966;
\t border: 3px solid #855321;
\t font-size: small;
\t text-align: center;
\t margin: 0;
\t padding: 0;
\t }<!DOCTYPE html>
<html lang="en">
<head>
<title>Enoch Treadwell's Trash Service</title>
<meta charset="utf-8">
<link rel="stylesheet" href="styles.css">
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js">
</script>
<![endif]-->
</head>
<body>
<div id="wrapper">
\t <header role="banner">
\t \t <h1>Enoch Treadwell's Trash Service</h1>
\t </header>
\t <nav role="navigation">
\t \t <ul>
\t \t \t <li><a href="index.html">Home</a></li>
\t \t \t <li><a href="services.html">Services</a></li>
\t \t \t <li><a href="contact.html">Contact</a></li>
\t \t </ul>
\t </nav>
\t <div id="container">
\t \t <main role="main" class="float-left">
\t \t \t <h3>Who We Are</h3>
\t \t \t <p>Enoch Treadwell's Trash Service is the new option in your town for all your trash disposal needs! Weather your looking for a weekly trash pick up or just a one time pick up by appointment we are the best choice! We offer great rates on all our trash disposal services! We even have a special offer for year contracts for weekly pick-up service at the low price of 15.99 a month! Please visit our convenient location at blah blah blah or give us a call at (999) 555-1234 between the hours of 8 to 5 M-F or 10 to 2 on Saturday.<p>
\t \t </main>
\t \t
\t \t <div id="main-right">
\t \t <img src="special2.png" class="float-right" width="100" alt="Specials">
\t \t \t <h3>Specials</h3>
\t \t \t
\t \t \t <ul>
\t \t \t \t <li><span class="highlight">10% OFF</span> Dumpster Rental for bulk</li>
\t \t \t \t <li><span class="highlight">$15.99 </span> a month for Weekly Pick-Up with a one year contact.</li>
\t \t \t \t <li><span class="highlight">20% OFF</span> Pre-Sorted Recyclables</li>
\t \t \t \t <li>Discounted rates for Monday pick-ups.</li>
\t \t \t </ul>
\t \t \t
\t \t </div>
\t </div>
\t <footer role="contentinfo">
\t \t <a href="index.html">Home</a> | <a href="services.html">Services</a> | <a href="contact.html">Contact</a><br>
\t \t Copyright © 2014 Alyssa Harvey<br>
\t \t <a href="mailto:[email protected]">[email protected]</a>
\t </footer>
</div>
</body>
</html>
哇感谢这么多。我很惊讶它通过了W3C验证！下次我会确保自己检查一遍，即使它通过了验证。 – Alyssa 2014-10-19 14:49:53
好，请接受答案。谢谢 – 2014-10-19 14:50:32