如何使用一个背景图像为主div，有两个div，一个在左边，一个在右边

Question

我想创建一个HTML，CSS页面，其布局如下：
<！> lt; div id = <！> quot; content <！> quot; <！> gt;
<！> lt; div id = <！> quot; left <！> quot; <！> gt;
.....点击 LT <！>; / DIV GT <！>;结果 <！> lt; div id = <！> quot; right <！> quot; <！> gt;
.....点击 LT <！>; / DIV GT <！>;结果 LT <！>; / DIV GT <！>;结果 内容div具有应在y方向上重复的背景图像。此外，左右div应该在同一背景图像上并排。我能够完成它但保持内容的高度固定，但我不想让内容的高度固定。请帮帮我。 在此先感谢：）

Answer 1

没有看到你的代码......我的猜测是你正在浮动左右DIV ......但是你没有浮动内容DIV ......

您的CSS应该与此类似，以使其有效：

#content {
    float:left;
    background-image:url('whatever.png');
    background-repeat:repeat-y;
}

#left {
    float:left;
}

#right {
    float:left;
}

Answer 2

  

我能够完成它但是通过   保持内容的高度   固定但我不想做   内容的高度固定。

如果你能够在Y方向上重复背景图像，那么#content div的高度应该无关紧要，因为你的背景只会填满剩下的空间 - 对吗？

如果你的内容div没有扩展到子div的高度，那么显然float必须在页面的正常流程之外，在这种情况下你应该<=>它而不是设置容器的高度格。

Answer 3

很难理解你想要做什么，但我想你要做的是将overflow: auto添加到你的内容div中，这样它就会变得与你的内容相同左右div：

#content {
  overflow: auto;
  background: [bg code]
}
#left, #right {
  float: left;
}