0

以下のような背景があります。

ここに画像の説明を入力

問題は、包含ボックスの幅を白い領域の最後までしかカバーしないように設定したいため、影が「オーバーフロー」する必要があることです。余分な幅を避けようとしているので、アウト コンテナやパディングを使用したくありません。背景がオーバーフローした場合、ブラウザーは水平方向を作成しません。これとそれがまさに私が欲しいものです。

これを達成する方法はありますか、それとも全幅を使用する必要がありますか?

4

1 に答える 1

0

背景をオンに<body>してもスクロールバーには影響しないため、影が必要なものによっては、これと同様のことができる場合があります。

body {
    background: url(http://i.stack.imgur.com/ftW5z.png) no-repeat center top;
    margin: 0;
}
.container {
    width: 1014px; /* inner space of shadow image */
    margin: 35px auto; /* 35px matches size of top shadow */
}

http://jsfiddle.net/gjsxn/2/のデモ

別のコンテナーで同じ効果を達成し、min-width と overflow hidden を使用する可能性があります。

于 2013-04-25T13:23:37.077 に答える