要素の中の要素 margin-topが効かない | Tech Blog HibachiyaCSSの話題 div要素の中にdiv要素を入れます。 中に入れた子のdiv要素にmargin-topを指定します。 でも、外側のdiv要素も一緒に引きづられて下に下がっています。 つまり、この状態から 以下の状態にしたいので、中のボックス要素に margin-top:50px; としたとします。 するとこうなるのです。 中のbox要素に設定したmargin-topに引きずられてしまいます。 これを 『margin の相殺』 と言います。 詳しくはこちらを見てください。 marginの相殺 解決策は、 この場合は、外側のボックスにpadding又はborderが設定する必要があります。 私はpaddingを設定して反応しなかったのと、 borderの設定がしたくなかったので、結局絶対配置にしました。 以上です。
