0

可能重复：
获取 CSS Div 以填充可用高度

基本上我有一个CSS设置如下：

   body {
        font-family: "Open Sans", Arial, sans-serif;
        background: url(images/body-background-gradient.png) repeat-x #343434;
        text-align: center;
    }
    #background-tile {
        background: url(images/body-background-tile.png) repeat;
        width: 100%;
        min-height: 100%;
        height: auto;
        position: absolute;
        left: 0;
        top: 0;
        z-index: -2;
    }

HTML：

<body>
    <div id="background-tile"></div>
        ...
</body>

主体具有水平重复的背景渐变。我在正文中有一个空的 div (#background-tile)，它充当叠加背景 - 只是一个重复的 2x2 像素方形图案。

问题是当页面拉伸到超过浏览器的高度时，平铺图案不会继续填充背景的其余部分，所以我最终在页面底部有一个没有平铺背景的部分 -只是灰色的背景。我做了很多搜索，但找不到可行的解决方案。

截图：http: //i46.tinypic.com/9i94xf.png

非常感谢任何帮助。谢谢。

4

2 回答 2

0

尝试给出body的位置relative和.background-tile高度100%（并摆脱min-height）

于 2012-09-26T15:47:56.147 回答
0

删除这个

width: 100%;
        min-height: 100%;
        height: auto;

它将尺寸设置为您正在使用的屏幕的高度......而不是整个网页。如果该代码与代码的任何其他部分相关，那么您可能需要找到解决方法。

于 2012-09-26T14:22:36.440 回答