Firstly, not sure if it belongs to CSS Combat category, but I guess it will involve some CSS tinkering.
I have a fixed navigation bar which obviously follows me all the way to the bottom of the page. The problem is, I wanted to make one of the pages display content using smooth scrolling and linking to certain sections’ ids.
I have 3 sections in there, each with separate ID and 3 links which href to respective sections, like this:
Now, if I click the link… Well, it is taking me to the given section, yes… but the top of the section is hidden beneath the fixed nav… How to make the bottom of the fixed nav the “top” of the page, how to make it behave like that? I tried with adding padding-top to these sectionss, then it works flawlessly, but then I have this strange big whitespace if I scroll up all the way back.
You could put invisible “anchors” with the present ids for each section so that the page scrolls to those anchors instead of the sections, then, just position those anchors whereever it suits you most…