Hover effecting another element?

How to change the property of an element when mouse hovers another element.

[eengin]

Hi,

I am trying to do this. Suppose you have two <div> s in the page which are separated (not nested). When the user puts the mouse over the first <div> I want to change the background color of the second <div>.

Is this possible using pure CSS? Like using some notation like (I am just making up, I know it does not work.)

#div1:hover div2
{
background-color:black;
}

Thanks...

[appi2]

#div1:hover + div2

[swa66]

The adjacent sibling selector might no be what the OP was looking for as it requires div1 to be immediately in front of div2 in the code and they need to share the same parent.

[w3.org...]

The really bad news will show up when you find out that IE6 needs to support this too (it won't)