このガイドで2つを区別する
パディングとマージンの違いがわからない場合は、あなただけではありません。 頻繁に尋ねられる質問で、多くのウェブデザイナーが困惑しています 。 このクイックチュートリアルでは、この2つを区別する方法を学びます。
違いを理解する
マージンやパディングは初心者のWebデザイナーや時には経験豊かなデザイナーでさえ混乱することがあります 。 結局のところ、いくつかの点では、それらは同じもののように見える：画像やオブジェクトの周りの空白。
パディングは、境界と実際の画像またはセルの内容との間の境界内の空間である。 画像では、パディングはコンテンツの周りの黄色の領域です。 パディングは内容を完全に囲むことに注意してください。 上、下、右、左の辺にパディングがあります。
一方、マージンは、境界線の外側、境界線とこのオブジェクトの隣にある他の要素との間のスペースです。 イメージでは、マージンはオブジェクト全体の外側のウィット領域です。 パディングのように、マージンは内容を完全に囲むことに注意してください。 上下左右に余白があります。
役に立つヒント
インターネットエクスプローラなどの一部のブラウザで、マージンやパディングを使って実際に気に入ったことを行う予定の場合は、ボックスモデルを正しく実装しないでください。 これは、あなたのページが他のブラウザとは異なって見える（時には大きく異なる）ことを意味します。