とにかく分かりにくいんだよ！

cssを触るようになって、marginとpaddingの違いがよく分からなくなる。両方とも、要素間の距離を作るけど、どっちが内で、どっちが外？使い方の違いは？

英語の意味で考えると、marginは「欄外、余白」とかの意味だから、外側のイメージがある。
またpaddingはpadってベッドパッドとか、なんかを中に入れる感があるから分かる。

外と内はこうやって覚えられる。

しかし、これにborderとか入ってくると厄介だ。

paddingは脂肪、marginは洋服だ！

すいません、完璧に自分が思っただけですｗ
paddingは脂肪。marginは洋服。

paddingは、背景色も含めて幅を取ることができる。
→ 脂肪は増えると、なかなか取ることができない。
→背景色が付いてきちゃう

一方marginは、背景色を含めないで幅をとる。
→ 服はいつでも脱げるので、余計なものが付かない。
→背景色は付いてこない

(書いてて改めて思ったけど、意味ワカンネｗ)

で、borderは、marginとpaddingの間に引かれる。
ようするに、皮膚のようなもんだ。

以上。