css 背景颜色问题答案

【问题标题】：css background-color troublescss 背景颜色问题
【发布时间】：2012-01-17 15:19:25
【问题描述】：

我正在更新网站上的标题，整个标题应具有浅灰色背景。为了实现这一点，我想我可以简单地将整个标题 div 的背景颜色设置为灰色（E7E7E7），但不知何故，我在它中间得到了一个空白，我似乎无法选择/查找Firebug 的整体 div。

整体div为class="header"的div，页面为http://www.momentumnow.biz/mn/index.shtml。

请告诉我我需要做什么来消除标题中的这个空白（以及我在这里做错了什么）。请注意，您需要使浏览器窗口变宽。我希望右侧的紫色闪光保持在页面的右侧，因为该人使页面变宽。

谢谢

【问题讨论】：

标签： html css

【解决方案1】：

你必须像这样clear your float：

div.header {
    background-color: #E7E7E7;
    min-width: 1010px;
    overflow: hidden;
}

现在写在你里面有three floated child DIV's .header DIV 需要有clear。所以，在你的.header 中写上overflow:hidden。

【讨论】：

谢谢桑迪普。我很困惑（显然！:-)。我看到我在标题 div（我刚刚移动）之外搞砸了。您能否扩展一下溢出：隐藏的作用，为什么它可以代替清除？感谢您的帮助。
如果可以，我会再问一个问题。有没有办法让中心部分“鼓舞人心的运动......”漂浮并坐在两个闪光片之间的中间，但在两侧使用最小的填充/边距？
对于您的第二个问题，您必须像这样更改标记jsfiddle.net/9R8SP
对于您的第一个问题，您最好查看这些链接quirksmode.org/css/clearing.html，stackoverflow.com/questions/2648205/…
好的，会的。非常感谢您为中间部分提供的附加代码。有一个美好的夜晚/白天。 :-)

【解决方案2】：

你必须清除你的花车。如果您使用 Chrome 工具检查 header，您会看到它的高度为 0。这是因为您浮动了内部元素（将它们拉出正常流动）。只需清除它们，您的容器就会再次具有高度。或者指定一个高度。

【讨论】：

谢谢。既然你们在这方面速度如此之快（谢谢顺便说一句），我可以问你，我如何定位附属护理会员链接，比现在高几个像素。我在底部给了它 4px 的边距，但它没有升起，我需要将 header 保持在不超过 120px 的高度（紫色闪光片是 100px 高）。谢谢。
@Ray - 为顶部分配负边距。边距就像元素边缘周围的额外空间。添加底部边距只会使其下方的内容向下推。
啊，谢谢。负边距做到了（我明白你在说什么把边距放在底部）。但是为什么这个元素没有直接撞到它上面的闪光片上呢？是否有一些我看不到的边距或填充？
... 看起来对象标签有一些边距或填充。当我添加一个类来清除它们时，我能够摆脱负边距。

【解决方案3】：

试试这个

<div class="header">
   <div class="headerLeft">
   <div class="affiliate">
   <div class="headerRight">
   <div style="clear: both"></div> //add this 
</div>

【讨论】：

【解决方案4】：

您可以检查是否 div 标题中的所有内容，并且在更改标题背景颜色时，内部内容也必须更改那里的背景颜色，否则您使标题上方的所有内容都应具有透明背景颜色，所以如果您更改听众背景，它将反映其他内部 div 和包含.........

【讨论】：