CSS: margin 、padding の上下左右の順番を図で確認
CSS で margin プロパティや padding プロパティを指定するときの、 上下左右の順番を図で確認します。慣れない間は忘れやすいですよね。
ポイントは上下左右のなかで、上が起点となることです。
4つ指定の場合、３つ指定の場合、２つ指定の場合を順番に見ていきます。
4つ指定の場合：上、右、下、左
margin: 1px 2px 3px 4px;
padding: 1px 2px 3px 4px;
４つを指定する場合は、上、右、下、左の順番です。 上（top）を基点に時計回りに、右（right）、下（bottom）、左（left）の順になります。
3つ指定の場合：上、左右、下
margin: 1px 2px 3px;
padding: 1px 2px 3px;
3つを指定する場合は、上、左右、下の順番です。上を基点に下へ降りていきます。
2つ指定の場合：上下、左右
margin: 1px 2px;
padding: 1px 2px;
2つを指定する場合は、上下、左右の順番です。
