0

頭が動かないという奇妙な問題があります。

ヘッダーdivがあり、水平方向に繰り返される背景画像を表示したいと思います。

HTML：

<div id="headerwrapper">

     <div id="header">
          <p>This is an extremely interesting test. This is an extremely interesting test. This is an extremely interesting test.</p>
     </div>

</div>

CSSは次のとおりです。

* {
    margin:0;
    padding:0;
}

#headerwrapper {
    margin:0 auto;
    width:630px;    
}

#header {
    width:630px;
    background-image:url(../images/headermiddleback.jpg);
    background-repeat:repeat-x;
}

ブラウザで見ると、テキストの上に表示されている背景画像のインスタンスは1つだけです。しかし、それは繰り返されていません。

私がここで間違っていることについて何か考えはありますか？

4

3 に答える 3

0

repeat-y代わりに使用したい場合がありますrepeat-x 

#header {
    width:630px;
    background-image:url(http://dl.dropbox.com/u/4457768/css/headermiddleback.jpg);
    background-repeat:repeat-y;
}
于 2012-05-27T10:32:32.860 に答える
0

これがjsFiddleの例です。動作しているようです。 http://jsfiddle.net/MgvLT/1/

おそらく、邪魔になっている他の CSS があるか、背景画像に多くの空きスペースがある可能性があります。あなたの例を jsFiddle に投稿してください。

于 2012-05-27T09:42:03.763 に答える
0

おそらく、ブラウザのキャッシュをクリアする必要がありますか?

たとえば、これは Chrome でそれを行う方法を示すSO 投稿です。

于 2012-05-27T09:44:48.267 に答える