hover over parent div does not affect child divs

**james438** · 01-13-2011, 04:59 AM

I am trying to hover over a parent div to change the background-color of that div, but I feel like the children are getting in the way. Here is a basic example of the code I am using:

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<style type="text/css">
.a1{clear:left;width:95%;}
.a1:hover{background-color:tan;}
.a2{float:left;padding-left:5px;width:30%;}
.a2:hover{background-color:red;}
</style>
<div class='a1'><div class='a2'>test</div><div class='a2'>test</div></div>
</HTML>

I want to be able to hover over test and have both divs turn tan or red.

any ideas?

**james438** · 01-13-2011, 06:12 AM

For some reason changing it from "clear" to "float" for .a1 fixed the problem.

Thread: hover over parent div does not affect child divs

Thread Tools

Search Thread

hover over parent div does not affect child divs

Bookmarks

Bookmarks

Posting Permissions