1

背景画像が 1322x622 あり、コンテンツを中央の 660 ピクセルに配置します。これは、Firefox 19 (Windows および Ubuntu) と IE 8 では正常に機能しますが、Chrome 25 では機能しません。Chrome では、背景画像の位置が固定されているように見えます。動作中のブラウザは、ブラウザ ウィンドウのサイズが小さく変更されると背景を切り取り、逆に大きく変更すると背景が切り取られます。

相対CSSは次のとおりだと思います。

html {
    position: relative;
    left: 50%;
    margin-left: -661px;
    overflow-y: scroll;
} 

body {
    padding-top: 39px;
    overflow: hidden;
    position: absolute;
    width: 1322px;
    background: $mkdBrown;
    background-image: url("banana_tree.jpg");
    background-repeat: no-repeat;
}

#wrapper {
    padding-top: 39px;
    min-height: 550px;
    float: center;
    position: relative;
    margin: 0 auto 0 auto;
}

.container {
    width: 660px;
}

ウェブサイトはhttp://www.monkeykateanddaves.com/です。

ティア！

4

1 に答える 1

0

background-positionCSSのプロパティを使用して、背景の配置を試すことができます。

例えば：

body {
    background-position : 660px 50px;
}

次のハックを使用して、Chrome 固有にすることもできます。

@media screen and (-webkit-min-device-pixel-ratio:0) {
    body { 
        background-position : 660px 50px;
    }
}
于 2013-03-07T00:29:15.227 に答える