css - 盒子模型问题

Question

我只是在玩布局，但遇到了问题。

我的标题元素被推到容器的顶部

http://codepen.io/anon/pen/CslkH

我错过了一些东西，但我想不出什么！

我什至设置了一个margin-top，它仍然被推到容器的顶部？

请帮帮人

Answer 1

你.header有一个margin-top: 25px，由于保证金崩溃，导致.container也向下移动。

取而代之的是top-margin，padding-top在.container.

这是您更新的笔：http ://codepen.io/anon/pen/pbvFI

Answer 2

添加overflow:auto到您的#containerdiv：

#container {
    background-color: #93C;
    width: 1000px;
    height: 1000px;
    overflow:auto;
}

jsFiddle 示例

您的浮动导致了这种情况，并且设置溢出会恢复块格式化上下文。