Underline menu vertical et horizontal

Bonjour ,
mon menu horizontal en css :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
 
ul#menu_horizontal { 
width : 814px; 
height : 120px;
margin : 3em 0 2 10;
padding : 0;
background-color : #f1b764;
border : none;
list-style-type : none; 
}
 
ul#menu_horizontal li {
padding : 0 0 5px ;  
line-height : 30px;
padding-left:0px;
 
}
 
ul#menu_horizontal li.bouton_gauche {
float : left;
border-right : none; 
padding-left:65px;
padding-right:30px;
}
 
 
 
ul#menu_horizontal li.bouton_droite {
float : right;
border-left : 1px solid black;
 
}
 
ul#menu_horizontal a {
color : black;
text-decoration : none;
padding : 0 0 20px 10px; 
font :  0.8em "Trebuchet MS";
 
}
 
ul#menu_horizontal a:hover { text-decoration : underline; }
 
ul#menu_horizontal a img { 
border : none;
padding :  0 0 5px 5px;
}

le menu horizontal html :

Code:

1
2
3
4
5
6
7
8
9
10
 
 
 
<ul id="menu_horizontal">
<li class="bouton_gauche"><a href="#"><img src="ecfr/m/image/10025_5_6.png"  alt="Retour en magasin"/><br /><br /><center>Retour en magasin</center></a></li>
<li class="bouton_gauche"><a href="#"><img src="ecfr/m/image/10025_8_6.png"  alt="news" /><br /><br /><center>Paiement s&eacutecuris&eacute</center></a></li>
<li class="bouton_gauche"><a href="#"><img src="ecfr/m/image/10025_11_6.png" alt="Livraison"/><br /><br /><center>Livraison</center></a></li>
<li class="bouton_gauche"><a href="#"><img src="ecfr/m/image/10025_14_6.png" alt="Carte de fidélité"/><br /><br /><center>Carte de fid&eacutelit&eacute</center></a></li>
 
</ul>

Je l'inclus dans ma page php et j'ai également un autre menu vertical inclut dans la même page.
J'ai un problème au niveau de text-decoration:underline sur le menu vertical.
Non seulement cela ne fonctionne plus mais les liens semblent inéxistant sur le texte! !

Le menu vertical css :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
 
 
 #navGauche
 
 {
 
 margin-top:250px;
 margin-left:80px;
 width:238px; 
 background-image:url(../img/g_fd.gif);
 background-color:#8c5464;
 height:700px;
 }
 
 #navGauche li{padding:2px 0 2px 23px}
 #navGauche ul
 {
 list-style-type:none;margin:0;padding:0 0 0}
 
 
 #navGauche a.navOff3:active{color:#585858;font:12px Arial, Helvetica, sans-serif;font-weight:normal;letter-spacing:normal;padding:0 0 0;text-decoration:none}
 #navGauche .niv3 a:hover{background-image:none;color:#000;font:12px Arial, Helvetica, sans-serif;font-weight:normal;font-style:italic;letter-spacing:normal;padding:0 0 0;text-decoration:none}
 #navGauche a.navOn3:link,
 
 
 #navgauche a:hover { text-decoration : underline; }
 
 
 #navGauche a.navOn3:active{color:#000;font:12px Arial, Helvetica, sans-serif;font-weight:normal;font-style:italic;letter-spacing:normal;padding:0 0 0;text-decoration:none}

le menu vertical html :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
 
 
		<div id="navGauche">
 
				<table>
						<tr>
						<!--id définit pour la fleche sur chaque td-->
							<td style="width: 25px; padding: 2px 0px 2px 0pt;" id="liI2"></td>
							<td>
								<div id="liG2">
								<br/>
								<div id="first-cat"><strong>NOUVEAUTES</strong></div>
 
								<a style="color: white; font-size: 14px;"
								 id="li2">Alsace</a>
								</div></td>
						</tr>
						<tr>
							<td style="width: 25px; padding: 2px 0px 2px 0pt;" id="liI3"></td>
							<td>
								<div id="liG3">
									<a 
									href='javascript:OuvrirPop("includes/aquitaine.html","fenetre popup",10,10,680,480,"menubar=no,scrollbars=no,statusbar=no")'
									style="color: white; font-size: 14px;"
									 id="li3">Aquitaine</a>	
								</div></td>
						</tr>
						<tr>
							<td style="width: 25px; padding: 2px 0px 2px 0pt;" id="liI4"></td>
							<td>
								<div id="liG4">
								<br/>
								<div id="first-cat"><strong>HABILLEMENT</strong></div>
 
									<a 
									href='javascript:OuvrirPop("includes/auvergne.html","fenetre popup",10,10,750,500,"menubar=no,scrollbars=no,statusbar=no")'
									style="color: white; font-size: 14px;" 
									 id="li4">Polaires - Softshells</a>
								</div></td>
						</tr>
                           </div>

Auriez-vous une solution pour que l'underline fonctionne ? gourous du css :p
Je vais partir sur un menu de Bisûnûrs je pense ,:ccool:
(Le underline est fonctionnel uniquement sur le horizontal ! !)