applying style to inner div on hover of outer div
css, html
Solution
You would use the `:hover` psuedo-class on the parent element, followed by the child element.
Updated jsFiddle example
.TheOuterClass:hover .TheInnerClass {
color:blue;
}
Problem
I have some HTML that looks like this: ``` <div class="TheOuterClass"> <div class="TheInnerClass">some text</div> </div> ``` With the following CSS: ``` .TheOuterClass{ width:100px; padding:5px 5px; background:black;} .TheOuterClass:hover{ pointer:cursor; background:red; color:yellow;} .TheInnerClass{color:white;} ``` What I want to do is have the text of the inner div change color on hover of the outer div. How can I do this with CSS only? The jsFiddle is here PS: I know it can easily be done with jQuery but this is about doing it with CSS only.