css - How do you link to a place in another page without any styling issues?

Question

I have a 'Meet Our Team' section on my home page and I want to be able to click a menu button 'Meet Our Team' and be directed there, even if I click it from another page.

My problem is that if I use #meet_our_team as the URL, the link doesn't work from another page. However, if I use a relative or absolute path plus '#meet_our_team' (e.g. home/#meet_our_team), the functionality works but it becomes styled like the 'Home' button when on the home page (i.e. the button looks pressed).

This is because the CSS class 'current-menu-item' is applied to the list element.

Is there a way I can have a working button that also styles correctly? I assume if I can suppress aria-current, it would work but I don't know if that is possible.

question from:https://stackoverflow.com/questions/65834502/how-do-you-link-to-a-place-in-another-page-without-any-styling-issues

Answer 1

It was a simple enough fix. Simply add the below to Additional CSS. On my first attempt, I didn't specify 'a' and so it didn't work

    #menu-item-1745 a {
    color: #5a5a5a;
}