Ciao a tutti,

sono un "esordiente totale" di CSS, ad ogni modo mi sto cimentando con un link con effetto hover...

Ho fatto questo CSS:

codice:
body {color: yellow;
            position:absolute; 
            background-color: black;
            background-attachment:fixed;
            font-color:yellow;
 }
img.redim {
    position: relative; width:1000px; height:150px;
}
td.redim {
	height:150px;
}
td.menu {
	height:30px;
	width:100px;
}

div#navigation{float: left;padding-top: 0px;}
div#navigation ul{list-style-type: none;margin: 0;padding: 0; list-style:none;}
div#navigation li{margin: 0 0 3px;padding: 0; list-style:none;} 

div#navigation a{
position: relative;
display: block;
width: 100px;
height: 30px;
}

div#navigation a span{
position: absolute; 
width:100px; 
height: 30px; 
border:0px;
cursor: pointer; /*per IE*/
} 

div#navigation a:hover span{
border=2px solid;
border-color=yellow;}  

/* qui definiamo le immagini di background che dovranno avere  le voci del menu */
div#menu_h span{background-image: url("btn_home.gif");}
div#menu_b span{background-image: url("btn_bio.gif");}
div#menu_c span{background-image: url("btn_contact.gif");}
div#menu_g span{background-image: url("btn_gall.gif");}
div#menu_a span{background-image: url("btn_arch.gif");} 
div#menu_f span{background-image: url("btn_fum.gif");}
Non è quello che davvero volevo fare, ma vabbeh... dovrebbe mettere un bordo giallo intorno al link quando vi passa il mouse, e toglierlo ovviamente quando il mouse va via.

Questo è il codice della pagina:

codice:
<table width="100%" height="100%" border=1 bordercolor=#0000FF summary="">

	<tr width="100%">
		<td class="menu"><div id="navigation"><div id="menu_h"><span></span></div></div></td>
		<td rowspan=3>logo</td>
		<td class="menu"><div id="navigation"><div id="menu_g"><span></span></div></div></td>
	</tr>
	<tr width="100%">
		<td class="menu"><div id="navigation"><div id="menu_b"><span></span></div></div></td>
		<td class="menu"><div id="navigation"><div id="menu_a"><span></span></div></div></td>
	</tr>
	<tr width="100%">
		<td class="menu"><div id="navigation"><div id="menu_c"><span></span></div></div></td>
		<td class="menu"><div id="navigation"><div id="menu_f"><span></span></div></div></td>
	</tr>....
Io ho IE6 e FF, e nessuno dei due lo visualizza correttamente, il bordo giallo non esce (se volete è qui, per ora: http://www.geddo.it/prova/index1.php?data=home )

Stavo già per ristudiarmi tutto... quando ho provato IE7 sotto Vista... e cacchio! Li' funziona perfettamente...

Ad ogni modo... c'è qualche errore nel CSS??

E perchè IE7 lo visualizza lo stesso?

Grazie, ciao