0
現在、div1の中にdiv2があり、両方に同じサイズがあります。 div2に枠線/余白を追加したいが、div2のサイズを減らさず、div1のサイズを拡大する。子のサイズ+マージンに基づいて親divを拡大する
どうすればいいですか?
現在、div1の中にdiv2があり、両方に同じサイズがあります。 div2に枠線/余白を追加したいが、div2のサイズを減らさず、div1のサイズを拡大する。子のサイズ+マージンに基づいて親divを拡大する
どうすればいいですか?
外側容器はwidth
とheight
プロパティを必要としません。この場合、子要素(.div2
)にmargin
がある場合、外部コンテナ(.div1
)が展開されます。より良く理解するためのコード例を参照してください:)
.div1 {
border: 4px solid #111;
width: auto; /* remove width */
height: auto; /* remove height */
display: inline-block; /* make it more flexible */
}
.div2 {
width: 100px;
height: 100px;
background: cyan;
}
.div2.with-margin {
margin: 20px;
}
<div class="div1">
<div class="div2"></div>
</div>
<div class="div1">
<div class="div2 with-margin"></div>
</div>
ありがとうございました! – yoan26
ませ外側のdivの幅/高さが、ディスプレイ:代わりに...行わインラインブロックを。 – CBroe
ありがとう!私はこのインラインブロックオプションを学び、勉強します。 – yoan26