Question

我有css代码：

#container {
    background: url("/static/img/fauxColumns1.png") repeat-y;
    overflow: hidden;
    width: 100%;

，申请div。这会导致div图像重复到页面底部。

在页面顶部，我有一个div：

#navbar {
    background-color: silver;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    margin-bottom: 10px;
}

，成功创建低于10px的保证金。

但是，我也有一个div：

#footer {
    background-color: silver;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
    clear: both;
    text-align: center;
}

，但如果我使用'margin-top: 10px'，则无法成功创建边距，因为'fauxColumns'会扩展以弥补差距。

那么，有没有人知道如何解决这个问题？

修改：http://jsfiddle.net/Tj3jH/1/ 但是，我不知道如何添加我的img文件，即fauxColumns.png（我想我必须将其上传到其他网站并链接它？）我试图用whiteLine10px.png解决这个问题，但是还没有找到那个......

Answer 1

与基于你的小提琴{@ 1}}对@ s_qw23的回应不同，实际上是容器的孩子。

将#footer移到#footer之外可以解决您的问题。（我只是用bing来抓一个背景图片......虽然我怀疑它会产生影响你需要测试才能确保）

Working jsFiddle

background：url（“/ static / img / fauxColumns1.png”）repeat-y（-10px？）

1 个答案: