Opera e :hover

[pix]

Ho un piccolo problema con la visualizzazione di una <ul> con Opera 9.02
quando vado con il mouse sopra un collegamento di questa lista il testo diventa grassetto ma viene "tagliato" in maniera strana e succede solo con opera.

La lista dei vini sotto "la cantina" a riposo risulta cosi



Mentre se vado con il mouse sopra "Vini bianchi internaz." la scritta si modifica come vedete qui sotto



praticamente viene tagliata in qualche modo ma non capisco come. anche perchè il riquadro "i menu" posto a sinistra utilizza la stessa porzione di codice CSS ma questo problema non si verifica...



Avete idea di quale possa essere il problema?

vi posto anche le parti di codice interessato, sia html che css

<div id="boxmenu">
		<h1>I menu</h1>
		<ul class="box">
		[*]Novembre 2006
		[*]Ottobre 2006 
		[*]Settembre 2006
		[/list]
</div>
<div id="boxcantina">
		<h1>La cantina</h1>
		<ul class="box">
		[*]Vini Bianchi
		[*]Vini Bianchi Internaz.
		[*]Vini Rossi
		[*]Vini Rossi Internaz.
		[*]Le Bollicine
		[*]Piccole Bottiglie
		[*]Magnum
		[/list]
</div>

/*-------------STILI COLLEGAMENTI NEI BOX CUCINA----------------*/


ul.box {
	list-style-type: none;
	margin:0;
	padding: 0;
	
	}

ul.box li {
	height: 15px;
	font: 11px tahoma, verdana, sans-serif;
	padding:0;
	margin:1px 1px 0 1px;
	background-color:#873634;
	letter-spacing: 1px;
	text-align: left;
	line-height:12px;
	text-indent: 2px;
}



ul.box li a {
	text-decoration: none;
}

ul.box li a:hover {
	font-weight: bold;
}


/*-------------FINE STILI COLLEGAMENTO NEI BOX CUCINA-------------------*/


/*-----------POSIZIONE DEI BOX CUCINA --------------------------*/


#boxmenu {
	position: absolute;
	bottom:10px;
	left:5px;
	width: 150px;
	height:150px;
	background-color: #b16768;
	border-bottom:2px solid #57100e;
	border-right:2px solid #57100e;
}

#boxcantina {
	position: absolute;
	bottom: 10px;
	left: 160px;
	width: 150px;
	height:150px;
	background-color:#b16768;
	border-bottom:2px solid #57100e;
	border-right:2px solid #57100e;
}

#boxrum {
	position: absolute;
	bottom: 10px;
	left: 315px;
	width: 175px;
	height:150px;
	background-color:#b16768;
	border-bottom:2px solid #57100e;
	border-right:2px solid #57100e;
}

/*------------ FINE POSIZIONI BOX CUCINA -------------------*/

Io non riesco a capire a cosa possa essere dovuto questo problema e la cosa che mi lascia perplesso è che una stessa lista formattata con la stessa parte di codice si comporta in maniere corretta mentre l'altra no....
Qualche suggerimento?

[pix]

up :master:

[Another-Life]

Sconsiglio vivamente l'utilizzo della proprietà position: absolute;....gestisci la loro disposizione con la proprietà float: valore;

[pix]

effettivamente flottandoli il problema si risolve...
ma non ho capito perchè


non avrei mai pensato fosse dovuto al posizionamento...



beh cmq grazie Another-Life

[Another-Life]

Per ulteriori chiarimenti quando dichiari un elemento con la proprietà position: absolute;,quest'ultimo viene automaticamente rimosso dal flusso del documento per cui non ha piu relazione con nessun elemento della pagina.