CSS Transition bei hovern eines anderen Elements

[Pfandleiher]

Allen Überlegungen muss eine HTML-Struktur zugrunde liegen. Die solltest du zeigen. Sonst kommen hier Lösungsvorschläge, die du dann mit "geht in meinem Fall aber nicht, weil ..." beantworten musst.

Das sehe ich ein:

<div id="page">  
  <div id="background">  
    <div id="green">Green BG</div>  
    <div id="red">Red BG</div>  
  </div>  
  
  <div id="content">  
    <div id="col1">hierarchical menu</div>  
    <div id="col2">  
       <a href="redpage.htm">Red Topic</a>  
       <a href="greenpage.htm">Green Topic</a>  
    </div>  
    <div id="col3">extra content</div>  
  
  </div>  
</div>

Ich dachte erst der CSS-Selektor ~ würde gehen, ala

#red{  
    opacity: 1;  
}  
  
#green:hover ~ #red{  
    opacity: 0;  
}

Aber das scheitert ja, da #red und der Link zu greenpage.htm nicht auf der gleichen Ebene liegen. Daher ist die Anforderung des HTMl total gerechtfertigt!

Ich hoffe ich bin meiner Verpflichtung jetzt nachgekommen :-)