回答編集履歴

1 追記しました。

LibertyBell3

LibertyBell3 score 1074

2017/04/17 01:39  投稿

ちょっと日本語が不自由なので意味が分かっていませんが、
`padding`は内側のマージンなので、確実に効きます。
[ここらへん](http://creator.aainc.co.jp/archives/5952)をよく読んでご理解ください。「ボックスモデル」で検索
わたくしの場合、ほとんどの局面で、`padding`を選択します。
上下の兼ね合いとか考えないで良いので。
`margin`を使うのは、そうしなければならない時くらいで、
例えば、`h2`などに`border-bottom`とか`backgroud-image`を指定する場合、
要するに、その要素最下部まで背景・罫線がある場合は、絶対に`padding`では指定できないので、
という感じです。
まぁその場合でも、次の要素に`padding-top`を入れちゃえば、必要ないので、
そちらの対応が多いかなと思います。
そちらの対応が多いかなと思います。
追記:
もしかして、最上部で隣接する要素が無い場合のこと?
解釈としては、一番最初の要素に`margin-top`を指定する→効かない。
ってのは、おそらくその前に高さが確定したものがないからだと思います。
ブラウザの気持ち:
その前の要素から`margin-top`っていうけど、要素が無いから高さが無いじゃん。
んじゃ、マージンくれてやらないよ。ってことかと。
[こちらの「テキストとか挟まってると、大丈夫。」](http://qiita.com/mochizukikotaro/items/53eea34bcd644daddd44)ってところで
示されている通り、テキストで高さが確定するから、`margin`でも効くんだと思います。

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る