没有空白的简单背景颜色 div答案

【问题标题】：Simple background color div without white space没有空白的简单背景颜色 div
【发布时间】：2012-07-03 20:47:41
【问题描述】：

尝试创建一个背景色为白色的内容框。它位于页眉 div 和页脚 div 之间，它们都是图像。我无法让它与两个 div 对齐并且没有空格，只有一个或另一个。

这是 CSS：

#content {
    background-color:#ffffff;
    width:1024px; 
    margin: 0 auto; 
    font-family:Verdana, Geneva, sans-serif;
    font-size:12px;
    padding: 0;
    display: inline-block;
}

如何让内容框与页面的其余部分对齐并且没有任何空格？

这就是现在的样子，我想去掉 HELLO 框和它上面和下面的图像之间的空间。

【问题讨论】：

如果您可以在jsfiddle.net 上发布您的问题，也许会更容易理解？我迷路了:)
我们需要更多您的代码。至少图片的css，html也不错。
嗯，所以你想要顶部的页眉，底部的页脚，以及两者之间的内容？并且内容需要来自页眉的底部和页脚的顶部？或者类似的东西？
我对jsfiddle不太熟悉，但是代码是这样的：jsfiddle.net/xaEc8
是的，现在是这样：HEADER (image) [WHITESPACE] CONTENT (background color) [WHITESPACE] FOOTER (image)....这有意义吗？

标签： whitespace css

【解决方案1】：

这对我来说似乎不是一个干净的解决方案，但我开始了：

#content { 
margin-top: -15px; margin-bottom: -15px; 
}

其实我不知道-15px是否足够好，你应该尝试自己的值。

【讨论】：

【解决方案2】：

这不是一个很好的解决方案，但根据给定的信息，这是我唯一能想到的。

CSS

#content {
    background-color:#ffffff;
    width:1024px; 
    margin: 0 auto; 
    font-family:Verdana, Geneva, sans-serif;
    font-size:12px;
    padding: 0;
    display: inline-block;

    position:relative;
}

#topWhiteFix, #botWhiteFix {
    position:absolute;
    left:0px;
    height:12px;
    width:100%;
    background:#FFFFFF;
}

#topWhiteFix {
    top:-12px;
}

#botWhiteFix {
    bottom:-12px;
}

HTML

<div id="content">
     <div id="topWhiteFix"></div>
     <div id="botWhiteFix"></div>

     HELLO
</div>

（未测试）

【讨论】：