0

次のHTMLについて考えてみます。.wrap左右に50pxのパディングがあるdivがあります。そのdivの中に別のdivがあり.fullます。のパディングを克服して、デフォルトの幅を増やしたい.wrap。

幅が.wrapの幅と等しくなるように、パディングを-50pxに設定していますが、機能しません。

HTML：

<div class="wrap">
    <div class="inner">
        <div class="normal">xx</div>
        <div class="full">should be same width (300px) as wrap</div>
    </div>
</div>

CSS：

.wrap{
    height: 500px;
    width: 300px;
    margin: 0 auto;
    padding: 0 50px;
    background: yellow;
}

.full{
    background: orange;
    padding: 0 -50px;
}

デモ： http： //jsfiddle.net/WDS6X/

4

1 に答える 1

2

この場合、マージンを使用する必要があります。内側のスペースにはパディングが使用されます。使用する

margin: 0 -50px;

.full-divのパディングが希望どおりに機能する代わりに、コメントでniennによって提供されたJSFiddleを次に示します。

さらに理解するために、かなり良い説明を含むこのSOスレッドを見てください。

于 2012-12-26T21:19:36.780 に答える