html - 不应该存在的填充

Question

我有一个我之前询问过的 2 列布局 ( Simple 2 column layout )。我注意到，问题不在于右侧内容列的位置，而是该列中内容的定位方式。

找了半天也没看出问题出在哪里。看起来右列中的内容的填充等于左列的高度。

这是我的CSS:

#wrapper { margin-left: 100px; width: 1000px; border-left: 1px solid #bcbcc6; border-right: 1px solid #bcbcc6; border-bottom: 1px solid #bcbcc6; }
/* Main page content, puts actual content and sidebar side-by-side */
#sidebar { float: left; padding: 5px; width: 189px; border-right: 1px solid #b6bcc6; }
#content { padding: 0 !important; margin: 0 0 0 200px; width: 790px; background-color: #ff00ff; }

编辑:要查看实际情况，您可以查看 http://www.logansarchive.za.net/bad.jpg和 http://www.logansarchive.za.net/firebug.jpg我还将添加与页面和样式相关的文件(样式表和图像)，以便您可以在闲暇时进行检查: http://www.logansarchive.za.net/Default.aspx

Answer 1

在你的 <div id="content"> 里面你有一张 table clear: both在它的 CSS 中，然后是 2 个带有 clear: left 的 div和 clear: right分别在它们上面，这会破坏您的花车。在 Firebug 中删除所有这些明确的属性，在您的测试页上为我修复了它。