Bonjour tout le monde !
bon voila mon soucis:
Comme indiqué dans le titre, je suis dans un cas un peu particulier où je dois utiliser une image PNG transparente en tant que background-image d'un tableau. Ce tableau contenant par la suite lui même des images servant de liens.
Jusque là, aucun problème sous Firefox et IE7.
Afin d'assurer la compatibilité avec IE5,IE6... j'ai donc rajouté un petit hack qui fait ceci :
Niveau apparance, pas de soucis ça roule sous IE6. Le soucis vient du fait qu'avec le hack l'image qui est censé être en arrière plan m'empeche d'accéder aux liens contenus dans mon tableau
Voici le code du tableau en question, si ça peut aider :
Voili voilou, si certains d'entre vous ont une idée... j'suis preneur !!
Merciiiiii
bon voila mon soucis:
Comme indiqué dans le titre, je suis dans un cas un peu particulier où je dois utiliser une image PNG transparente en tant que background-image d'un tableau. Ce tableau contenant par la suite lui même des images servant de liens.
Jusque là, aucun problème sous Firefox et IE7.
Afin d'assurer la compatibilité avec IE5,IE6... j'ai donc rajouté un petit hack qui fait ceci :
<!--[if lt IE 7]>
<style type="text/css">
.catal_fondtab {
background-image:none;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/catal_fond.png', sizingMethod='scale');
background-repeat:no-repeat;
}
</style>
Niveau apparance, pas de soucis ça roule sous IE6. Le soucis vient du fait qu'avec le hack l'image qui est censé être en arrière plan m'empeche d'accéder aux liens contenus dans mon tableau
Voici le code du tableau en question, si ça peut aider :
<table width="175" border="0" align="center" cellpadding="0" cellspacing="0" class="catal_fondtab">
<tr>
<td height="17"><img src="images/spacer.gif" width="1" height="17" /></td>
<td width="1" height="17"><img src="images/spacer.gif" width="1" height="17" /></td>
</tr>
<tr>
<td style="padding-left:50px;"><a href="#"><img src="images/catal_labels_r1_c3.gif" width="101" height="65" border="0" id="Image13" onmouseover="MM_swapImage('Image13','','images/catal_labels_r1_c3_roll.gif',1)" onmouseout="MM_swapImgRestore()" /></a></td>
<td> </td>
</tr>
<tr>
<td align="center"><img src="images/catal_labels_r3_c4.gif" width="41" height="11" /></td>
<td><img src="images/spacer.gif" width="1" height="13" /></td>
</tr>
<tr>
<td style="padding-left:25px;"><a href="#"><img src="images/catal_labels_r5_c2.gif" width="122" height="44" border="0" id="Image14" onmouseover="MM_swapImage('Image14','','images/catal_labels_r5_c2_roll.gif',1)" onmouseout="MM_swapImgRestore()" /></a></td>
<td> </td>
</tr>
<tr>
<td align="center"><img src="images/catal_labels_r3_c4.gif" width="41" height="11" /></td>
<td><img src="images/spacer.gif" width="1" height="13" /></td>
</tr>
<tr>
<td style="padding-left:16px;"><a href="#"><img src="images/catal_labels_r7_c1.gif" width="145" height="45" border="0" id="Image15" onmouseover="MM_swapImage('Image15','','images/catal_labels_r7_c1_roll.gif',1)" onmouseout="MM_swapImgRestore()" /></a></td>
<td> </td>
</tr>
<tr>
<td><img src="images/spacer.gif" width="1" height="22" /></td>
<td><img src="images/spacer.gif" width="1" height="22" /></td>
</tr>
</table>
Voili voilou, si certains d'entre vous ont une idée... j'suis preneur !!
Merciiiiii