Question

我有这个超级简单的代码：

<body>
<div style="position:fixed; width: 100%; height: 40px; background: #333"></div>

<div style='margin-top:40px; border: 1px solid green'>
Some contents!<br>Some contents!<br>Some contents!<br>
</div>

</body>

但不知何故固定div的边距为40px并与第二个div重叠！有人请指出我在这里错过了什么吗？

JS小提琴：http://jsfiddle.net/hoangkhanh/zHkkH/

谢谢！

Answer 1

您对顶部div设置了position:absolute，但未设置top:0个位置。试试这个：

<body>
<div style="position:absolute; width: 100%; height: 40px; background: #333; top: 0"></div>

<div style='margin-top:40px; border: 1px solid green'>
Some contents!<br>Some contents!<br>Some contents!<br>
</div>

</body>

Fiddle

Answer 2

将top，left，right或bottom css属性添加到固定div。

例如

{
    top: 0; /*Fixes it to the top*/
}

奇怪的CSS固定行为

2 个答案: