CODEWITHSUNDEEP
csshtmltwitter-bootstrapanchor
Alex
Alex

Reputation: 2959

Menubar hidding div when using anchor linking

I use Bootstrap and I have a fixed menubar at the top. I add a padding-top on my body in order to display properly the div.

body {
    padding-top: 80px;
}

Everything is ok but, when I try to navigate with anchors there's no padding anymore and my div is partially hidden.

You can find an example on this JSFiddle. http://jsfiddle.net/TUy7C/

How to fix this problem ?

Upvotes: 1

Views: 138

Answers (1)

2507rkt3
2507rkt3

Reputation: 21822

You could apply the padding to each of the sections instead of the body, and then add a negative bottom margin to close the gap between sections:

http://jsfiddle.net/TUy7C/2/

#home, #about, #contact {
    padding-top: 80px;
    margin-bottom: -80px;
}

Upvotes: 1

Related Questions