位置相對固定，但頭

Question

我必須相對位置下面的頭就像這裏：

但我想可以在頭部固定，當滾動內容時，所以我嘗試'的位置是：固定的。

現在的問題是，它看起來像：

是否有人有一個想法？

Answer 1

如果你的頂欄的高度是已知的，添加相同的寬度，頂部位置，以您的內容，看看代碼或檢查小提琴：

<div class ="topbar"> 

</div> 
<div class="content"> 
<p>first line</p> 
<p>abc</p> 
<p>abc</p> 
. 
. 
. 
<p>abc</p> 
</div> 

的CSS：

.topbar{ 
    position:fixed; 
    width:100%; 
    height:50px; 
    background-color:#000; 
    box-shadow: 0 6px 2px -2px gray; 
} 
.content{ 
    position: relative; 
    top:60px; 
} 

fiddle

Answer 2

添加一個margin-top設置等於您的標題的高度到內容容器（即當前被固定標題重疊的元素）