固定ヘッダーがオーバーラップコンテンツにならないようにする

Question

私はこの問題に悩まされています。

同じページで内部/アンカーリンクを使用しています。両方ともnav-menu/headerリンクとVERTIAL DOT NAVIGATION Jqueryプラグインから。セクションの最初の60ピクセルとヘッダーが重複しない限り、別のセクションにリンクすることはできません。私はmargin-top: 60px;を.containerと.section-topクラスに追加しようとしていますが、成功しません。

ヘッダーを60pxと重複させずに、nav-menu/headerリンクとjQueryドットナビゲーションの両方をリンクすることができます。

詳細はjsfiddleを参照してください。

Answer 1

ただ、この追加：

[id^="section"]{ 
    padding-top: 60px; 
} 

をし、この

.section-top { 
    margin-top: 60px; 
} 

https://jsfiddle.net/w8u2kg1j/を削除

Answer 2

のみパディング領域とヘッダーの重なりを持つように、以下のCSSを使用してみてください：

section { 
    padding-top:60px; 
}