Working in a restrictive system trying to modify a parent menu item

[tannercampbell]

Hey all, watch the video, it’ll show the problem.

I have written the most batsh*t crazy selectors to address this thing and it’s not working.

What kind of crazy you ask? This kind of crazy:

ul.pureCssMenu li:nth-child(7):not(:hover) {
background-color : #ffa800;
}

Help?

Video: https://youtu.be/GZY8lwDPcKk

Thanks!

[Paulie_D]

Videos aren’t really conducive to getting assistance here.

Also , explaining the actual issue rather than letting us guess is preferred.

A functional reduced/MINIMAL demo in codepen.io is much more useful to us. We can inspect the code and make changes to see what happens.

Help us help you.

[tannercampbell]

Yeah that’s all true but because I’m working within a piece of software that doesn’t give me access to anything directly, except a custom stylesheet I can apply to the page, I don’t have a way of scooting the primary stylesheet and html over to codepen.

That said I can paste the html in there…

Here: https://codepen.io/anon/pen/OEyMee

EDIT: I stand kind of corrected, I can piece it together from the source tab in my Chrome inspector. I’ve edited the codepen. More useful now.

EDIT 2: Yeah I guess you’re right about “letting you guess”. The problem is that the top level menu item falls back to some #444 or #333 (I’m guessing) color when navigating the drop down beneath it that I can’t find in the inspector to identify how to talk to the element and style it correctly. I just want the Reports menu item to retain the same appearance it has when it’s hovered or not hovered over when the dropdown menu isn’t revealed.

[Author]

Posts