Soluzione Rollover per cambio immagini

[99caos]

Ho una cartina e 4 percorsi diversi da visualizzare.

(ecco il link di esempio: prova.html)

Ho impostato la cartina come background di un div

poi ho messo 4 link e ho associato ad ognuno un bk diverso

solo che non riesco ad allinearli.

Ho una soluzione in JS per risolvere questo problema ma volevo cercare di non usare i javascript!

Vi posto i codici html e css.

html:

<style type="text/css" title="currentStyle" media="screen">
	@import "mappa.css";
</style>

<div id="mappa">

	Autostrada
	Ferrovia
	Circumvesuviana
	Mezzi Pubblici

</div>

Css:

#mappa {
	width: 500px;
	height: 300px;
	background: transparent url(img/site/mappa.jpg) no-repeat bottom left;
}
a#autostrada, a#circumvesuviana, a#ferrovia, a#mezzipubblici {
	position: absolute;
	top:0px;
	color: Black;
	display: block;
	height: 300px;
	width: 100%
}
a#autostrada {			left: 0px;  }
a#ferrovia {			left: 100px; }
a#circumvesuviana {	left: 155px;  }
a#mezzipubblici {		left: 255px; }

a:hover#autostrada {
background: transparent url(img/site/mappa-auto.gif) 
no-repeat bottom left 0px;
} 

a:hover#ferrovia {
background: transparent url(img/site/mappa-ferrovia.gif) 
no-repeat bottom left;
} 

a:hover#circumvesuviana {
background: transparent url(img/site/mappa-circumvesuviana.gif) 
no-repeat bottom left;
} 

a:hover#mezzipubblici {
background: transparent url(img/site/mappa-mezzipubblici.gif) 
no-repeat bottom left;
}

[99caos]

up

[Mich_]

Io cambierei metodo:
Non il posizionamento assoluto, ma l'uso opportuno di
float:left;
in tutti i blocchi <a>

[99caos]

ma in questo modo si affiancano non si sovrappongono

[Mich_]

Allora non ho capito.

Dal codice postato ho intuito che c'e` una immagine grande di sfondo, a cui vengono sovrapposte 4 immagini parziali in caso di rollover (link :hover).

Le 4 immagini piccole non sono affiancate?


Ho guardato ora il link.
Il funzionamento attuale e` corretto? Non mi pare.
Non e` che puoi fare in modo che le 4 immagini siano disgiunte;
oppure in alternativa che tutte occupino lo stesso spazio (occorre rivedere le aree, e forse usare una mappa, in tal caso).