0
Chrome，FF和IE8中的一切都可以。但在IE6有一个奇怪的保证金权格“中列”的（里面有2 3周的div称为featured1和3），这是上述的div“左柱”和“右栏“）。我已经尽了一切努力摆脱这个问题。我尝试了“显示：内联技术”和CSS重置。请帮忙！我测试我的网站here传奇般的IE6边距和填充“行为”的烦恼（帮助！）
我的HTML：
<body id="home">
<!-- header -->
<div id="header">
<div class="container">
<h1><a href="http://widerdesign.co.nr/">wider design</a></h1>
<!-- navigation -->
<ul id="navigation">
<li class="home"><a href="index.php"><span>home</span></a></li>
<li class="portfolio"><a href="portfolio.php"><span>portfolio</span></a></li>
<li class="about"><a href="about.php"><span>about</span></a></li>
<li class="contact"><a href="contact.php"><span>contact</span></a></li>
</ul>
</div>
</div>
<div id="content">
<div id="top-column">
<p>We <strong>design and develop</strong> clean and effective webs in the <strong>top 3 languages</strong>
on the Internet. Internet is mean to reach the whole world.You are mean to reach the whole audience:</p>
</div>
<div id="middle-column">
<h2>Featured Projects</h2>
<div id="featured1">
<a href="contact.php" target="_blank"><img alt="" src="images/project1.png"/></a>
<p>Featured work number 1</p>
</div>
<div id="featured2">
<a href="contact.php" target="_blank"><img alt="" src="images/project2.png"/></a>
<p>Featured work number 2</p>
</div>
<div id="featured3">
<a href="contact.php" target="_blank"><img alt="" src="images/project3.png"/></a>
<p>Featured work number 3</p>
</div>
</div>
<div id="left-column">
<h2>Web Design</h2>
<p>Create a web site easily with this online HTML generator. Follow the steps below to create web pages then click "view html page" to test it once it's completed. You can copy and paste generated code where you wish within the generated document(s). For example: You created an HTML table with 3 rows and 3 columns. You then added a link, which appears below the HTML table. If you want the link inside the HTML table, just cut and paste it inside the table in place of an "ADD TEXT" statement. Any where text,images,or links need to be, there will be a generated "ADD TEXT" statement in the HTML pages.</p>
</div>
<div id="right-column">
<h2>Web Translation</h2>
<p></p>
</div>
</div>
<div id="footer">
<div class="container">
</div>
</div>
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-11932489-1");
pageTracker._trackPageview();
} catch(err) {}
</script>
</body>
</html>
我的CSS复位：
/* reset */
* {
margin: 0;
padding: 0;
}
img {
border: none;
}
ul {
list-style: none;
}
/* tags */
body {
background-color: #FFFFFF;
color: #757575;
font-family: Arial, "MS Trebuchet", sans-serif;
font-size: 75%;
}
h1 {
background: url(../images/logo.png) no-repeat scroll 0 0;
margin-bottom: 20px;
text-indent: -9999px;
}
h2 {
color: #669BD9;
font-family: Arial;
font-size: 16px;
font-weight: normal;
margin-bottom: 10px;
}
a {
font-family: Arial, "MS Trebuchet", sans-serif;
}
/* classes */
.container {
margin: 0 auto;
width: 960px;
}
我的CSS结构：
#content {
background-color: #FFFFFF;
padding: 20px;
overflow: hidden;
margin: 0 auto;
width: 960px;
}
#content h2 {
border-top: 1px dashed #C0C0C0;
border-bottom: 1px dashed #C0C0C0;
padding: 2px 0 2px 0;
margin: 15px 0 15px 0;
}
#top-column {
color: #818181;
font-size: 16px;
font-family: Arial, "MS Trebuchet", sans-serif;
margin: 10px 0 10px 0;
padding: 10px 0 20px 0;
}
#top-column strong {
font-weight: normal;
color: #3C3C3C;
}
#middle-column div {
float: left;
height: 224px;
width: 320px;
}
#right-column {
float: left;
width: 420px;
}
#left-column {
float: right;
width: 500px;
}
#footer {
clear: both;
background-color: #F0F0F0;
height: 200px;
}
我刚刚意识到IE为＃middle-column内的每个#featured div添加了一些边距（或填充）。我怎样才能解决这个问题？ – alexchenco 2009-12-09 10:32:47