菜單是由格低於

Question

我試圖創建一個佈局，看起來像這樣，那裏的標誌可以滾動過去超限，但菜單仍然固定在頁面的頂部：

---

^^標誌^^
~~ ~~~~
** **菜單
~~ ~~~~
正文文本正文正文。

---

This jsfiddle perfectly represents my plan。我正在使用Bootstrap的Affix插件來滾動菜單「粘性」，而且效果很好。問題是，正文（section#main）rolls over the menu when I scroll up。

網站標記大致是：

<header> 
    <div id="logo"></div> 
    <div id="nav-search"> 
     <div class="row"> 
      <div id="menu-top"></div> 
     </div> 
    </div> 
    <div class="clearfix"></div> 
</header> 

<section id="main" class="row"> 
</section> 

我堅持搞清楚如何說服#nav-search以自身。我正在設定高度#nav-search。使用z-index，我可以推動頂部的#nav-search div，但這仍然意味着此時菜單被粘貼，一定量的身體變得模糊。我錯過了什麼？

Answer 1

這個固定爲我在您發送的鏈接：

#nav-wrapper.affix { 
    postion: fixed; 
    top: 0; 
    width: 100%; 
    z-index: 1; 
}