Ereditare formattazione per i link da una classe

[massimiliano_82]

Salve a tutti, è la prima volta che scrivo su questo forum, anche perchè lavoro con l’HTML e i CSS a livello amatoriale e molto probabilmente il problema che vi stò per esporre sarà una banalità.

Lo scenario è il seguente:
Ho una pagina HTML, il cui layout è fatto tramite una tabella, e la formattazione del testo è contenuta in un foglio di stile separato. Ho formattato anche i link (a:link, a:hover...) tramite questo foglio.
Ora alla fine della pagina html c’è un’unica cella in cui ho inserito del testo, una parte allineato sinistra e una parte allineato a destra, con questi attributi:

.testo_bottom_sx {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #FFFFFF;
float: left;
text-align: left;
}

.testo_bottom_dx {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
color: #FFFFFF;
float: right;
text-align: right;
}

Ora nel testo contenuto in questa cella voglio inserire 2 link (uno a dx e uno a sx) che devono avere essere visualizzati con la stessa formattazione di cui sopra e sottolineati appena si passa il mouse di sopra. Il problema sta nel fatto che il link è un oggetto “a” che ho già formattato con (a:link, a:hover...) e non voglio utilizzare la stessa formattazione generica. Come faccio?
Questo è il codice della cella:

<td height="34" colspan="2" valign="middle" background="img/red_bar_bottom.png">
<div class="testo_bottom_sx">testo_testo_testo
link a sinistra</div>
<div class="testo_bottom_dx">testo_testo_testo
link a destra</div>
</div></td>

in pratica il link deve avere la stessa formattazione come descritto sopra e non prendere la formattazione generica contenuta nel foglio di stile. Inoltre il tutto deve essere su una riga, in questa maniera:

[testo_a_sx + link_a_sx___________testo_a_dx + link_a_dx]


Spero proprio che qualcuno possa aiutarmi. Grazie.

[Mich_]

Anzitutto mi pare di vedere un grave errore di semantca: l'uso di tabelle per formattare.
Se non usi la semantica corretta, diventa molto piu` difficile usare i CSS.

Altro problema: mescolare formattazione HTML (height="34" colspan="2" valign="middle" background="...") con formattazione fatta con i CSS: in caso di conflitto browser diversi si comportano in modo diverso: sposta tutta la formattazione nel CSS.

Poi per definire la formattazione dei tag, nel tuo caso ti basta:

.testo_bottom_sx a, .testo_bottom_dx a {
  /* regole di formattazione valide sempre */
}
.testo_bottom_sx a:hover, .testo_bottom_dx a:hover {
  /* regole quando e` hover */ 
}

Questo va inserito DOPO le regole generali del tag <a>

[massimiliano_82]

Fantastico! Funziona perfettamente!
Grazie mille x la dritta e per il consiglio, il prossimo sito lo faccio solamente con i css.

Ciao!