[Résolu] Débordement qui apparaît sous Firefox mais pas sous IE

Je suis confronté depuis hier à un petit soucis visuel pas bien grave, mais drôlement coriace

Comme pied de page, j'utilise une sorte de bandeau composé de 3 images juxtaposées, dont une extensible.
J'avais essayé de réaliser ça en CSS+XHTML pur et dur mais lors d'une précédente réalisation, j'avais été confronté à un problème de compatibilité avec IE 5.0.
Par conséquent, je réalise encore ce bandeau avec un tableau

Voilà pour l'introduction

Mon problème :
Voici le résultat sous IE :

http://toto.free.fr/images/varisup-ie.jpg

Et sous Firefox :

http://toto.free.fr/images/varisup-firefox.jpg

Voici la page de la maquette : http://toto.free.fr/varisup/articles/h-huile-carburant.php

Enfin, voici le code HTML correspondant au bandeau :

<div id="article-bando-bas">
 <table cellpadding="0" cellspacing="0">
  <tr> 
    <td><img src="../images/bando-bas-gauche.jpg" width="22px" height="50px" /></td>
    <td background="../images/bando-bas-x.jpg" width="100%" height="50px">
    	<a href="../accueil.php">Accueil</a> <b>&middot;</b> 
    	<a href="../adherents.php">Espace Adhérents</a></td>
     <td><img src="../images/bando-bas-droite.jpg" width="22px" height="50px" /></td>
  </tr>
 </table>
</div>

...et le code CSS qui va avec :

#article-bando-bas {
 height: 50px;
 margin: 0;
 padding: 0;
 border: 0;
 font-size: 10px;
 text-align: center;
}

Je ne sais pas trop ce qui dérappe dans mon système, ormis le fait que j'utilise un tableau (mais comment faire autrement avec une longueur extensible?)

Merci pour votre aide
Modifié par EcliptuX (19 Dec 2006 - 16:24)

Tu n'aurais sûrement pas ce souci en faisant une liste, en ce qui me concerne les tableaux j'ai tout oublié, ^^

déjà supprimes les "px" dans les width="..." et height="..."

ensuite, il est possible d'arriver au même résultat avec un seul DIV. Les images gauches et droites seront en float: left; et float: right;
Modifié par anthony (21 Feb 2005 - 17:01)

millenium a écrit :
Tu n'aurais sûrement pas ce souci en faisant une liste, en ce qui me concerne les tableaux j'ai tout oublié, ^^

Malheureusement si : si je vire le contenu pour ne laisser que les images (et le tableau donc), le bug est tjrs là.

a écrit :
déjà supprimes les "px" dans les width="..." et height="..."

Ca n'a rien changé

a écrit :
ensuite, il est possible d'arriver au même résultat avec un seul DIV. Les images gauches et droites seront en float: left; et float: right;

Oui mais tu le mets comment le contenu du menu ? Une liste OK... mais comment obtenir le même résultat que j'ai obtenu avec le tableau (sans le bug bien sûr ) ?

anthony : tu gagnes mon plus profond respect sur ce coup
Tu m'as ouvert une sacré voie

OK Dominique, mais qd on a plusieurs images, c'est pas faisable si ?

EcliptuX a écrit :
anthony : tu gagnes mon plus profond respect sur ce coup
Tu m'as ouvert une sacré voie

OK Dominique, mais qd on a plusieurs images, c'est pas faisable si ?

il était même possible de faire mieux
par exemple remplacer les images par des DIV et mettre les images en background dans ces DIV avec les bonnes dimensions. Cela éviterais que les images s'affichent quand le CSS est absent.

dominique, ton site n'a même pas de Doctype et n'est même pas compatible HTML Transitionnel