TheBold: Div 1 hover = div 2 verändert sich

Beitrag lesen

Hallo,

ich habe folgenden Link gefunden: http://www.tutorials.de/css/281768-div-1-hover-div-2-veraendert-sich.html
Und habe versucht dies genauso zu bauen:
HTML:(CSS ist im head natürlich eingebunden)

  <body>  
   	<div id="page">  
    	<div>  
        	<div>  
            </div>  
        </div>  
        <div class="item" id="item_1">  
        </div>  
        <div class="goto_invis" id="go_invis_1">  
        </div>  
        <div class="goto_vis" id="go_vis_1">  
        </div>  
    </div>  
  </body>

CSS:

body {  
	background-color: 		#FFFFFF;  
}  
#page {  
	position:				absolute;	  
	left:					50%;			  
	margin-left:			-450px;		  
	width:					900px;  
	top: 					10px;  
}  
#go_vis_1	{  
	position:				absolute;  
	left:					200px;  
	height:					200px;  
	width:					400px;	  
}  
#go_invis_1	{  
	position:				absolute;  
	left:					200px;  
	height:					200px;  
	width:					400px;  
	visibility:				hidden;	  
}  
#item_1	{  
	position:				relative;  
	left:					10px;  
	top:					10px;  
}  
#item_1:hover #goto_invis_1,  
#item_1:hover + #goto_invis_1 {  
    visibility: visible;  
}  
.goto_vis	{  
	background-color:		#0F0;  
}  
.goto_invis	{  
	background-color:		#00F;  
	visibility:				hidden;	  
}  
.item	{  
	width:					120px;  
	height:					40px;  
	background-color:		#F00;	  
}  
.item:hover	{  
	background-color:		#FF0;  
}  
/*.item:hover .goto_invis,  
.item:hover + .goto_invis {  
    visibility: visible;  
}*/

Kann mir jemand helfen, wieso dies nicht geht?
Dass das mit dem DIV-hover bie IE6 nicht geht ist mir bekannt.
Danke schonmal.