周囲の要素との聞に取る余自のことをマージン といいます。 「margin-top」「magin-bottom」「margin-left」「margin-right」の4 つのプロパティ がそれぞれ上下左右のマージンを指定するプロ パティです。それぞれ、単位を付けて具体的 な長さを指定することができます 。注意すべきことは、垂直方向のマージンは上の要素の下マージンと下の要素の上マージンの合 計値ではなく、両者の内大きいほうになるとい うことです (左右のマージンは左の要素の右 マージンと右の要素の左マージンの合計値になる)。
パディングとは直訳すれば「詰め物」のことで、ある要素内に含まれる文字などの内容物の外周 (border プロパティなどで枠線を付けたときは その内側の線) からのことをいいます。 「padding-top」「padding-bottom」「padding-left」「padding-right 」がそれぞれ上下左右のパディングを指定するプロパティです。それぞれ、単位を付けて具体的な長さを指定することができます。
ボックスモデルとはその名の通り、各要素の配置を箱を 置いておくようなイメージでとらえるものです。意図したレイアウトにならないときは、このボックスモデルの理解が不十分なことに原因がある場合があります。