Archived topic
Nav Bar/Menu Color on "Active" Links
9 replies · Started by Jennifer on September 19, 2018
Hi,
Currently set up the color scheme on my nav to display diff colors when hovering and when active. However, when on the "About" page, the "Program" tab also changes colors. I saw another thread that mentioned that this is a WordPress issue, something about parent pages and/or categories. However, none of the pages are categorized nor are they set up with parent pages.
Please help.
Thanks in advance!
Hi there,
on larger width browsers i am seeing issues with the Elementor header shape dividers escaping the section and overlapping the navigation bar, which is affecting its behaviour.
Not sure how that would affect why the nav bar menu colors are staying "active." And what width exactly? Because I'm using a pretty large monitor and I'm not seeing what you're referring to. Thanks!
To make it a bit clearer. Menu text is white, orange when you hover, and blue when active. I have several menu anchors within the pages so I can see why those items are remaining "active." However, the Program page and the About page are two separate pages. Why is it that when I'm on the About page, they are both blue.
So this is what i am seeing, this is Chrome, but have tested on FF and Safari:
https://www.useloom.com/share/539cbfc243934624b0ef183f9569f93e
I cannot replicate the hover color issue, if there is a particular setup or page it is occurring on then let me know.
Towards the end of the video you will see when i extend the browser full screen that the Elementor header is overlapping the menu making it non respondent. Also i noticed that the information bar below the nav is sometimes interfering with the nav on higher zoom levels.
Ah, I see. It's the border separator that's overlapping. I'll look into it. As far as the hover/active issue, it's happening when on the About page. Funny that it didn't recreate on your machine as I've had several people tell me they're seeing the same thing that I'm seeing.
The Elementor section in the header also has negative bottom margin, which causes the container to overlap, this can interfere with the focus and hover detection. I would remove that and see if it improves.
Issue seems to have resolved on its own. Thanks!
Didn't change anything, but will message back if the issue pops up again. Thanks!
Awesome :) Glad to hear that
