顶部菜单向下移动时增加一些内容

Question

我有以下代码

https://jsfiddle.net/c1kumo0y/

顶部的菜单被移动了一下，滚动当英雄的内容是可见的最顶部，当以下行被删除：

<p id="firstLine">Projeniz mi var? Biz Yapalım</p></br> 
<p id="secondLine">Projelerinizi en uygun fiyatlar la sizin yerinize Biz Yapalım</p> 

顶部菜单变成正常，有什么可能导致这种情况？任何帮助？

Answer 1

这是余量折叠的效果： http://www.howtocreate.co.uk/tutorials/css/margincollapsing

缘塌陷发生无论两个（或多个）的顶部或底部边缘是接触。基本的想法是，当他们碰触时，而不是获得两个边距的总和，使用较大的一个，而忽略另一个。

有很多可能的方法来解决您的问题。例如，您可以添加1px填充以分割页边距：

#container { 
    padding-top: 1px; 
} 

或者您可以插入一些内容。或者，也许可以找到更适合您需求的其他方式。

Answer 2

.fixedWidth { 
    margin: 0 auto; 
    max-width: 1100px; 
} 

试试这个。