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;

Webページ全体ではなく、使用している画面の高さに寸法を設定します。そのコードがコードの他の部分に関連している場合は、それを回避する方法を見つける必要があるかもしれません。

于 2012-09-26T14:22:36.440 に答える