3

我在尝试让我的主容器(白色背景)伸展到内容的底部时遇到问题,它目前仅在标题中运行。我已经绞尽脑汁很久了,我尝试添加一个清晰的,并确保主容器中的所有容器都浮动但仍然没有乐趣。

这是一个实时网站,可以在http://www.ridermagazine.co.uk查看

我还注意到我的侧边栏已经下降到内容下方而不是显示在右侧,这让我相信我的数学错误,但我已经仔细检查了所有内容,似乎没有任何问题地方。

任何帮助都是极好的。

谢谢。

容器的 CSS 代码:

#page-wrap {
width: 926px; 
margin: 20px auto;
background-color:#fff;
padding:17px;
}
4

3 回答 3

1

问题在于使用所有 float:left 指令。如果所有作为块元素的元素都是块元素,则不需要它们。例如,h1元素header不是块元素。似乎某处是h1 {display: inline}-例如全球。如果您在浏览器的检查器中将其覆盖为 h1 {display: block} 白色背景“正在增长”;-)。所以我的提示:删除所有浮动指令并重新开始编写。

记住:浮动是邪恶的 ;-)

如果你真的需要,就使用它。例如,如果您需要两个主要的 div 元素彼此相邻。还可以考虑使用溢出 ....

编辑:错误在 div 中id="content"。删除float:left,它的工作原理

这就是我对邪恶浮动元素的意思;-)

于 2012-11-11T11:59:28.733 回答
0

尝试添加:

<div class="clear"></div>

在“page-wrap” div 的末尾。

于 2012-11-11T11:58:34.133 回答
0

更准确的答案是

<div style="clear:both"></div>

因为他没有提到他是否有一个名为 clear 的课程

“在“页面换行”div 的末尾。”

于 2012-11-11T11:59:42.987 回答