網格960 - 粘貼標頭

我使用960gs，我希望我的標頭&導航欄粘在頂部。我試圖堅持div的使用位置：固定。結果：整個960網格混亂了。網格960 - 粘貼標頭

<!-- Header--> 

<div class="container_12 stick"> 
<div class="grid_6 alpha "> 
... 
</div> 

<div class="grid_6 omega"> 
... 
</div> 

</div> 

<!-- NavBar-> 
<div id="nav" class="container_12 stick"> 

<div class="grid_2 alpha prefix_4" > 
    <h1><a href="#whoami">...</a></h1> 
</div> 

<div class="grid_2 button textAlignC"> 
    <h1><a href="#works">...</a></h1> 
</div> 

<div class="grid_2 button textAlignC"> 
    <h1><a href="#hobbies">...</a></h1> 
</div> 

<div class="grid_2 omega button textAlignC"> 
    <h1><a href="#contacts">...</a></h1> 
</div> 

</div> 

.stick{ 
position:fixed;  
}

想法？

來源

2011-10-11 danieltorres

使用包裝像這樣：

<html> 
    <head>stuff</head> 
    <body> 

     <div id="nav"> 
      <div class="container col_12"> 
      </div> 
     </div> 
     <div id="content"> 
      <div class="container col_12"> 
      </div> 
     </div> 

    </body> 
</html>

，並在div＃NAV固定的頂部，它的工作原理。你可能想給Div＃內容一個邊緣的推動與導航欄的高度更好的滾動效果..記住這不適用於手持設備，所以如果需要使用框架

來源

2011-10-11 22:30:47

我申請的職位：固定到導航，使用你給我的結構。依然混亂網格。 nav內的內容浮動。 – danieltorres

在容器'代碼'中最後一個浮動元素之後使用網格的清除類（

）'代碼' –

我已經嘗試清除。只是無法理解爲什麼如果浮動當我激活位置：固定。 – danieltorres

這個jsfiddle顯示它應該如何工作... http://jsfiddle.net/s5syC/

來源

2011-10-12 07:45:08

如果您使用960gs框架嘗試使用該代碼，則該代碼無效。 – danieltorres

978或960網格css之間沒有真正的區別..只是尋找容器的類命名和屬性的差異..並確保您的cols數到適當的寬度..應該沒有額外的餘量，填充或col元素的邊界，除非您也覆蓋寬度 –

在標頭上添加z-index:-length-;會有所幫助，但我試圖找到更好的解決方案。

來源

2012-08-08 06:13:22 johnp

網格960 - 粘貼標頭

回答

相關問題