我在页面顶部有一个经典的固定导航栏菜单。（直接从Bootstrap examples页面的基本示例中获取）我希望有一个菜单选项，一旦单击，显示一个折叠元素，从而使页面向下移动，为这个元素腾出位置。
它现在还可以工作，但是它有一个奇怪的行为。每当我点击菜单选项时，折叠元素确实会显示，向下滑动页面的其余部分，但是它不知何故会将自己放在屏幕的顶部，导航栏的后面。我不知道如何使它从导航栏的底部向下滑动。这很难解释，所以这里有the link to the page，然后点击CONTACT看看它做了什么。注意滚动条，它看起来元素在正确的位置，但它强制向上滚动，所以元素的顶部在屏幕的顶部，在导航栏下面。
下面是我正在使用的HTML代码的一部分：
这是需要显示的折叠元素：

<div class="wrapper">
    <div class="row-fluid centerSpan ">
        <form id="contact" class="form-horizontal collapse">
            <fieldset>

这一个是崩溃的调用（最后一个<li>）：

<ul class="nav">
    <li class="active"><a href="#">Acceuil</a></li>
    <li><a href="#about">CV</a></li>
    <li data-toggle="collapse" data-target="#contact"><a href="#contact">Contact</a></li>
</ul>