1

ナビゲーションバーの背景を提供するラッパーに繰り返し背景があります。ページの一番下まで拡張する必要があります。ラッパーの最小高さを 100% に設定するだけで、これを実現したいと考えていました。これを行うと、背景が消えます。誰かが理由を知っていますか？

サイトはこちら: https://hodkiewicz-zieme-and-hirthe180.myshopify.com/

関連する CSS は次のとおりです。

.wrapper {
    width: 940px;
    min-height: 100%;
    margin: 0 auto;
    text-align: left;
    background-image: url({{'body-bg.png' | asset_url}});
    background-repeat: repeat-y;
}
4

3 に答える 3

1

div class="content"の下に次のhtm/cssを追加します。

HTML：

<div class="content">...</div>
<div class="clear-fix"></div>

CSS：

.clear-fix {
    clear: both;
}
于 2012-11-05T01:37:32.140 に答える
1

要素をフロートさせるときはいつでも、親要素は通常崩壊します。それを修正するには、clearfixハックを使用する必要があります。

http://css-tricks.com/snippets/css/clear-fix/には、クラスをスタイルシートにコピーして、ラッパークラスの横で次のように使用するのが適切です。class="wrapper clearfix"

このフロートはラッパーを崩壊させています #navbar {float:left}

于 2012-11-05T01:27:59.697 に答える
1

こんにちはfloating、あなたはあなたの親でchild elementsはないので、問題が発生しているので、問題のある親が解決します。clearwrapper divclearwrapper divoverflow:hidden;

下記のCSSでCSSを更新してください

CSS

.wrapper {
    background-image: url("http://static.shopify.com/s/files/1/0098/1262/t/107/assets/body-bg.png?2789");
    background-repeat: repeat-y;
    margin: 0 auto;
    min-height: 100%;
    overflow: hidden;
    text-align: left;
    width: 940px;
}
于 2012-11-05T05:56:48.323 に答える