css bug table IE 5.5 et 6
Bonjour à tous,
J'ai un soucis original de CSS avec IE (pour changer) 5.5 et 6, les table et bords arrondis.
Donc en premier lieu je définis mon css pour les div affichant les coins :
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
|
.relsample {
position: relative;
}
.relsample
.top_left,
.relsample
.top_right,
.relsample
.bottom_left,
.relsample
.bottom_right {
height: 25px;
width: 25px;
background-repeat: no-repeat;
position: absolute;
}
.relsample .top_left {
top: 0px;
left: 0px;
background-image: url("images/Dtheme/cornergh.gif"); z-index: 0;
}
.relsample .top_right {
top: 0px;
right: 0px;
background-image: url("images/Dtheme/cornerdh.gif"); z-index: 1;
}
.relsample .bottom_left {
bottom: 0px;
left: 0px;
background-image: url("images/Dtheme/cornergb.gif"); z-index: 2;
}
.relsample .bottom_right {
bottom: 0px;
right: 0px;
background-image: url("images/Dtheme/cornerdb.gif"); z-index: 3;
}
.relsample .content {
position: relative;
padding: 0px;
z-index: 4;
} |
Puis le css de mon tableau
Code:
1 2 3 4 5 6
|
#tabl{
border-left: 4px solid #000;
border-right: 4px solid #000;
border-bottom: 4px solid #000;
} |
Mon code HTML ensuite et très simple:
Code:
1 2 3 4 5 6 7 8
|
<div class="relsample"><div class="top_left"></div><div class="top_right"></div><div class="bottom_left"></div><div class="bottom_right"></div>
<table border="0" width="100%" cellspacing="0" cellpadding="0" id="tabl">
<tr>
<td>Blabla</td>
</tr>
</table>
</div> |
Le code marche très bien sur tout les navigateurs, sauf : IE 5.5 et 6 où un léger bug apparait de façon aléatoire :
http://dbfury.free.fr/bug.jpg
Comme vous pouvez le voir suivant le tableau un pixel de décalage apparait en bas de certaines tables. Pour l'instant je n'ai trouvé aucune similitude dans ces "apparitions" de décalage de 1px suivant les tableaux.
J'espère que vous serez me débloquer.
Je vous remercie d'avance et bonne journée à vous