Site logo

[Resolved] Linking a button to a section & avoiding navigation overlap

Home Forums Support [Resolved] Linking a button to a section & avoiding navigation overlap

Home Forums Support Linking a button to a section & avoiding navigation overlap

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1545085
    Tania

    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.

    #1545207
    Elvin
    Staff
    Customer Support

    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.

    #1555520
    Tania

    Thanks a lot it has worked really well.

    #1557008
    Elvin
    Staff
    Customer Support

    Glad it works for you. No problem. 🙂

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.