Archived topic
Linking a button to a section & avoiding navigation overlap
3 replies · Started by Tania on November 24, 2020
I have tried to link a button (tuition Plans) on home page to the section below on home page and had given anchor #tuition-plans
Have added in button's url = website.co.uk\#tuition-plans. It does link the section but the navigation overlaps, the section.
Have I done correctly or is there a more smart way of doing this.
How this could be adjusted so navigation will not cover top bit of the said section.
Hi,
We can make use of pseudo classes to create an offset for this.
Try this CSS:
div#tuition-plans::before {
display: block;
content: "";
margin-top: -285px;
height: 285px;
visibility: hidden;
pointer-events: none;
}You can change the margin-top and height value equal to the height of your header if you prefer to have it directly under it when you click the link.
Thanks a lot it has worked really well.
Glad it works for you. No problem. :)
