search

sfreytag / friday-theme

A Bootstrap 4 portfolio and blog theme for Jekyll
MIT License
69 stars 97 forks source link

Anchor links #10

Closed Esqarrouth closed 6 years ago

Esqarrouth commented 6 years ago

I tried to add anchor links on the about page.

It scrolls a little more down then it should. It looks like it scrolls an extra amount equal to the navigation bar height.

How can I solve this? Has anyone had an experience with these?

sfreytag commented 6 years ago

I have solved this exact problem in a different project. It is a bit messy, but you can use some CSS to work around the problem. If you are doing your anchor links with ids, then this CSS will add a pseudo element before it that should do what you need:

    a[id]:before {
        content: '';
        height: 53px;
        margin-top: -53px;
        display: block;
        visibility: hidden;
    }

where 53px is the height of the nav bar. You might need to adjust that if you've changed the styling.

Hope that helps! Let me know if it works and thanks for your input.

Esqarrouth commented 6 years ago

Thanks a lot that worked!