这是页面的 url: http://whiterootmedia.com/test 当灰色 div 内容扩展时，我需要正确的棕色 div 来增长。我在棕色 div 中垂直重复背景图像。
<body style="margin: 0px; min-width: 700px; height: 100%;">
<div class="site" style="background: yellow; min-width: 577px; height: 100%;">
<div class="banner" style="background: blue; height: 100px; width: 417px; float: left;">
Banner Banner Banner Banner Banner
</div>
<div class="body_container" style="background: pink; height: 100%;">
<div class="ads" style="background: brown; width: 160px; position: absolute; right: 0px; height: 100%; clear: left;">
Ads Ads Ads Ads Ads Ads Ads Ads Ads
</div>
<div class="tree" style="background: grey; white-space: nowrap; width: auto; min-width: 417px; clear: left;">
Content Content Content Content Content Content Content Content Content Content
<br />
</div>
</div>
<div class="grass" style="background: green; height: 100px;">
</div>
</div>
</body>
最佳答案
这样做的经典方法是使用一种称为 Faux Columns 的技术.
思路是把重复的背景图片放到容器上，background-position: 100% 0放在右边，让它看起来像是右边栏的背景. (右栏将具有透明背景。)
您无需担心列的高度，因为背景会填充容器的高度。
关于javascript - div高度需要根据旁边的div增长，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/7536943/