a:hover per tutto il div...come?

[simo600]

ciao!
non riesco a dare l'effetto a:hover per tutto il div invece che solo per la scritta linkata, dove sbaglio?

codice html:
<td width="15%" valign="top" class="links">
<div class="links">testo 1</div>
<div class="links">testo 2</div>
<div class="links">testo 3</div>
<div class="links">testo 4</div>
<div class="links">testo 5</div>
<div class="links">testo 6</div>
</td>

codice css:
.links {
font-family: Geneva, Arial, Helvetica, sans-serif;
font-size: 12pt;
font-style: normal;
color: #60ABD6;
background-color: #ECF0F8;
font-weight: 600;
border: thin solid #E8E8E8;
}

.links a:hover {
color: #ECF0F8;
background-color: #60ABD6;
}



grazie in anticipo!

[Federix]

Prova a mettere:

.links a:hover {
color: #ECF0F8;
background-color: #60ABD6;
display: block;
}

[Mich_]

Originariamente inviato da Federix
Prova a mettere:
[code]
.links a:hover {
color: #ECF0F8;
background-color: #60ABD6;
display: block;
}

Mi sembra piu` un "tirare a indovinare" che una proposta con alla base un ragionamento o una conoscenza.

Io vedo una serie di errori di semantica in quel pezzo di HTML, e quindi sistemare il CSS diventa improbo.
Prova ad usare una lista, al posto di tutti i div. Trovi vari esempi di menu tra i "link utili" di questo forum.

PS: non ho capito la richiesta: il tuo codice dovrebbe funzionare in tutti i link di quel pezzo (e solo di quello, se non hai altri oggetti con class="links")

[Federix]

Beh, io mi sono attenuto a rispondere alla sua domanda e non a parlare di semantica e altre cose. Se vuole illuminare tutto il box, deve mettere display: block; per illuminare tutto il contenitore.
Trovi che sia una risposta sbagliata??

[simo600]

intanto ringrazio entrambi....
sono alle prime armi quindi di errori di semantica ne avrò fatti parecchi (per il resto il validatore me ne da solo uno ), ora proverò con una lista come dici tu Mich_
cmq dovrebbe funzionare solo su quei links e con "display:block;" sembra che vada tutt'ok

[Mich_]

Originariamente inviato da Federix
Beh, io mi sono attenuto a rispondere alla sua domanda e non a parlare di semantica e altre cose. Se vuole illuminare tutto il box, deve mettere display: block; per illuminare tutto il contenitore.
Trovi che sia una risposta sbagliata??

Forse hai capito la sua domanda meglio di me, ma non credo che la tua risposta sia corretta.
Infatti comunque viene illuminato solo il tag, e non tutto il box.
Forse occore aggiungere anche width:100%; height: 100%;
in modo da allargare il link a tutto il box.

Pero` la soluzione corretta sarebbe:
<ul id="menu">
<li href="...">primo link
...[/list]
con il CSS:

#menu { ... }
#menu li {
  color: #60ABD6; 
  background-color: #ECF0F8;
}
#menu li:hover {
  color: #ECF0F8;
  background-color: #60ABD6;
}

Peccato che qualche browser (uno a caso) non riconosca questa cosa.

[simo600]

scusa ma se nessun browser lo riconosce allora è inutile che lo faccia con una lista? non ho capito bene....

[luca200]

Originariamente inviato da simo600
scusa ma se nessun browser lo riconosce allora è inutile che lo faccia con una lista? non ho capito bene....

Credo volesse dire che IE non riconosce "li:hover"...