Menu
I have a dynamically generated list that has potentially up to about 5 levels. I want the listed item text to underline when I hover over the listed item, however not the parent li.
see example.
http://jsfiddle.net/ca7fL/5/
you see when you hover on "this", the above parent li, underlines aswell.
Any ideas?
Cheers
848
Definition and Usage The :hover selector is used to select elements when you mouse over them. Tip: The :hover selector can be used on all elements, not only on links.
You might have linked your stylesheet to your HTML file improperly. Some other CSS in the context of your project may be overriding the piece that you've given here. You might be running into browser compatibility issues with the :hover selector or something else in your code that is breaking the styling.
The :hover CSS pseudo-class matches when the user interacts with an element with a pointing device, but does not necessarily activate it. It is generally triggered when the user hovers over an element with the cursor (mouse pointer).
That seems hard to achieve, since when you point the child li element you're also effectively pointing its parent.
There is a solution, though: add a span tag to your menu items, and make that tag hoverable: http://jsfiddle.net/ca7fL/16/
170
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
