CSS: マージンを指定する（margin プロパティ）
ボックスのマージンを指定するには margin プロパティを使用します。 マージンはボーダー（枠線）の外側の領域です。
内容領域、パディング、ボーダー、マージンの関係について知りたい人はコチラのページを参照してください。 （参考記事: CSSのボックスモデル）
マージンをまとめて指定する場合は margin プロパティを使い、 個別に指定する場合は margin-top、margin-right、margin-bottom、margin-left プロパティ を使います。
使用例
/* まとめて指定する場合 */
margin: 1px; /* 上下左右同じ */
margin: 1px 2px; /* 上下、左右 */
margin: 1px 2px 3px; /* 上、左右、下 */
margin: 1px 2px 3px 4px; /* 上、右、下、左 */
/* 個別に指定する場合 */
margin-top: 1px;
margin-right: 2px;
margin-bottom: 3px;
margin-left: 4px;
マージンの相殺について
上下に隣接するボックス同士のマージンは相殺されて、 大きい方のマージンが適用されます。
左右に隣接するボックス同士のマージンは相殺されません。
値の指定方法
★ 実数値＋単位
数値に単位を付けて指定します。（例 10px ）
★ パーセント＋%
包含ブロックの横幅に対するパーセンテージで指定します。（例 90% ）
★ auto
自動的に調整されます。ブロックレベル要素の場合は、上下のマージンは「0」となります。 左右のマージンにautoを指定すると、その要素を「センタリング」できます。 インライン要素の場合は上下左右のマージンが「0」となります。
ブラウザの初期マージン
一般的にブラウザの表示領域には、ブラウザ側でマージンの初期値が設定されています。 ブラウザの端から表示させたい場合は body 要素に「margin: 0」を指定してください。