2016-06-15 100 views
1

我不知道爲什麼標題嵌入到導航欄中,因爲它們是不同的元素?需要導航下的標題,沒有喜悅。感謝預期。 Link:https://jsfiddle.net/a6jxea0v標題元素嵌入導航元素

enter image description here

+0

你有你的導航元素設定在固定的位置。這將它從相對定位中移除並將其修復在屏幕的頂部。頭文件元素現在是文檔中最頂層的元素,並且它漂浮在屏幕的頂部(它隱藏在標題後面)。您只需要在CSS上工作。如果是我,我只需在相對定位元素的頂部添加一個邊距/填充值,以便內容清除導航元素。解決這個問題的另一種方法是從nav元素中刪除'position:fixed;'。 – zipzit

+0

謝謝,zipzit!我不知道固定位置元素是從文檔流中刪除的! –

回答

2

添加padding-top:45px;到你的頭,因爲你的導航欄有固定的位置,頭球機身頂部開始,所以你需要添加到頂的間距按導航欄的高度。

header { 
    width: 100%; 
    margin: 0; 
    padding:45px 0 0; 
    color: #000; 
} 

這裏的jsfiddle:https://jsfiddle.net/a6jxea0v/2/

+0

嗨,Mukesh。有沒有其他的方法可以將導航欄放回原來的位置(屏幕頂部)和下面的標題而不使用填充?你知道標題元素懸浮在導航中的原因嗎? –

+0

因爲你有固定的導航欄,所以標題開始在身體的頂部位置,它隱藏在導航欄下方 –

+0

非常感謝。 –