CSSでは、ポジションプロパティではマージンはどうしますか？

Question

マージンプロパティの代わりに相対的な絶対値を置くpositionプロパティを常に使用できますか？または、マージンを使用する必要があると述べているものがありますか？多分マージンは絶対的/相対的/固定的にできないものですか？

Answer 1

余白が拡大するため、余白が大きくなり、配置していない間に他の要素が押し込まれます。その上に、absoluteまたはfixedを配置すると、その要素はドキュメントフローから完全に取り除かれ、他の要素の位置には影響しません。一方、位置指定relativeは、相対的な位置に移動するだけです。 positionプロパティの

div { border:5px solid red } 
 

 
.margin { margin:5px; } 
 
.relative { position:relative;top:5px;left:5px; } 
 
.absolute { position:absolute;top:5px;left:5px; }

<p>Position (absolute):</p> 
 
<div><button class="absolute">bar</button><button class="absolute">foo</button></div> 
 
<p>Margin:</p> 
 
<div><button class="margin">bar</button><button class="margin">foo</button></div> 
 
<p>Position (relative):</p> 
 
<div><button class="relative">bar</button><button class="relative">foo</button></div>

Answer 2

オプションだけの要素が他の要素の位置に影響を与えたりしませんかを決定するために使用されています。デフォルトでは、positionプロパティを使用しないと、すべての要素がプレビューと次の要素に影響する相対的な状態になります。マージンのプロパティは、要素をより多くの要素を右下に置いたり、中間に置いたり、あまり広範囲にしたりするために使用されますが、言い換えれば、彼らは同じ目的のために別々にではなく、お互いに協力する2つの異なる特性です。