ヘッダーなどを固定するとき、通常は “ psition:fixed; ” を使うと思います。
しかし、上部に余白が出てしまう事があります。
その場合、次の要素の上マージン ” margin-top ” により、引っ張られる感じで、余白が付いてしまう場合が多いです。
例えば、要素 “header” に “ position:fixed; ” 、
次の要素、contents を固定ヘッダー分下げようとして、” margin-top:100px ” ; のように指定している場合です。
固定した“ psition:fixed; ” 要素の位置指定、“ top ”を省いている場合、この現象が起こります。
ですので、下記のようにちゃんと位置指定すると問題なく表示されます。
1 2 3 4 5 6 7 8 |
header{ position:fixed; top:0; } |