html - How can I activate a CSS style for a label when hovering over the associated checkbox? -
Every time I hover over a checkbox label, it turns yellow:
Markup
& lt; Input type = "checkbox" value = "hello" id = "hello" name = "deleted files []" /> & Lt; Label = "hello" & gt; Hello & lt; / Label & gt;
css
label: hover, label: active {background: yellow; }
When I take the related checkbox, I want to highlight the label. Is there a way to fire the same hover rule by using CSS if I can also hover over the checkbox? Or do I have to use javascript for this?
You can use CSS future selector, like this:
< Code> Labels: hover, label: active, input: hover + label, input: active + label {background: yellow; }
Note that this will not work in IE6.
Comments
Post a Comment