Bonjour
j'ai mon tableau menu comme suite:
sur FireFox tout a l'aire très bien quand je fais mon hover sur un item du menu (cellule du tableau), mais sur IE6, il ya un padding en moins pour les elements de droite, et un padding en plus pour les elements de gauche.
Sous FF:
http://img56.imageshack.us/img56/7641/48722138.jpg
Sous IE:
http://img148.imageshack.us/img148/6508/40710971.jpg
sous IE, les élements du tableaux bouge à chaque hover, et ça casse le tableau.
Le Css associé est le suivant:
Je ne sais pas ce que je devrais changer pour que ça reste fixe aussi sur IE, quelqu'un peut avoir une idée ?
Modifié par alyas2022 (22 Jul 2009 - 12:51)
j'ai mon tableau menu comme suite:
<table cellspacing="0" width="827" border="0" align="center" >
<tr id="pro_linedrop" height="28" >
<td width="84" class="menu1"></td>
<td width="110" class="menu1"><a href="index.php"><b>Accueil</b></a></td>
<td width="134" class="menu1"><a href="#"><b>Nos Services</b></a></td>
<td width="127" class="menu1"><a href="#"><b>Savoir faire</b></a></td>
<td width="98" class="menu1"><a href="tarifs.php"><b>Tarifs</b></a></td>
<td width="138" class="menu1"><a href="equipe.php"><b>Notre equipe</b></a></td>
<td width="149" class="menu1"><a href="contact.php"><b>Nous contacter</b></a></td>
</tr>
</table>
sur FireFox tout a l'aire très bien quand je fais mon hover sur un item du menu (cellule du tableau), mais sur IE6, il ya un padding en moins pour les elements de droite, et un padding en plus pour les elements de gauche.
Sous FF:
http://img56.imageshack.us/img56/7641/48722138.jpg
Sous IE:
http://img148.imageshack.us/img148/6508/40710971.jpg
sous IE, les élements du tableaux bouge à chaque hover, et ça casse le tableau.
Le Css associé est le suivant:
#pro_linedrop {
background:url(../images/menu/lrimages/back.jpg);
height:28px;
width:820px;
font-family:arial, verdana, sans-serif;
font-size:11px;
z-index:100;
padding:0 0 0 40px;
}
#pro_linedrop .menu1 {
margin:0;
padding:0;
list-style:none;
white-space:nowrap;
}
#pro_linedrop .menu1 a {
display:block;
height:28px;
float:left;
padding:0 0 0 5px;
text-decoration:none;
line-height:33px;
white-space:nowrap;
color:#009ee0;
}
#pro_linedrop .menu1 a b {
display:block;
padding:0 10px 0 5px;
}
#pro_linedrop .menu1 a:hover {
cursor:pointer;
color:#FF0;
float:left;
background:url(../images/menu/lrimages/black_1.gif);
height:28px;
}
#pro_linedrop .menu1 a:hover b {
display:block;
float:left;
background:url(../images/menu/lrimages/black_1.gif) right top;
cursor:pointer;
height:28px;
}
Je ne sais pas ce que je devrais changer pour que ça reste fixe aussi sur IE, quelqu'un peut avoir une idée ?
Modifié par alyas2022 (22 Jul 2009 - 12:51)