Mise en page en colonnes, pb de hauteur

Bonjour,

Voilà je suis en train de travailller sur un site avec des colonnes et j'ai un probleme de hauteur.
Sous ie ca marche nickel, avec n'importe quelle résolution :


mais sous firefox, (en plus c'est pas sur toutes les pages...) j'ai un bandeau blanc sous mon texte.


voilà le code HTML qui me pose probleme:

<div id="global">
  <div id="gauche">
    <div id="menu"></div>
    <div id="fruit"></div>
  </div>
  <div id="contenu"></div>
</div>

Ainsi que les styles relatifs :

html,body {
  font-size: 1em;
  font-family: 'Trebuchet MS', Arial, Verdana, Helvetica, sans-serif;
  color: #000000;
  background-color: transparent;
  margin: 0 0 0 5%;
  text-align: center;
  padding: 0;
  height: 100%;
}

#global {
  margin: 0;
  padding: 0;
  border: 1px solid red;
  background-image: url('../images/bg_global.jpg');
  background-repeat: repeat-y;
  background-position: left;
  border: 0px solid purple;
}

* html #global { height: 100%; } /* taille sous ie */

#contenu {
  margin-left: 215px;
  margin-top: 0;
  padding: 0 3em 0 3em;
  background-color: #ffeecc;
  background-image: url('../images/bg_contenu.jpg');
  background-repeat: repeat-y;
  background-position: left;
  border: 0px solid red;
}

* html #contenu { margin-left: 215px; overflow: hidden; } /* taille sous ie */

#gauche {
  float: left;
  width: 215px;
  overflow: hidden;
  min-height: 500px;
}

Une idée sur le pourquoi ça marche sous ie et pas firefox? Une idée pour résoudre le problème sous firefox?

Merci de votre aide.. la vraiment je vois pas...

Là je ne vois pas. Je pense que tu ne donnes pas assez d'éléments. Cette ligne blanche qui apparaîte a l'air de se placer en surimpression sur le contenu (elle ne prend pas toute la largeur du bloc, à ce qu'on dirait...), et il faudrait savoir à quel élément elle peut correspondre. Avec un code HTML schématique, ça risque d'être dur.

Avec un lien vers une page en ligne, ça irait mieux

Salut,
Et si tu ajoutes du padding-bottom à #contenu, ne serait-ce qu' 1px ?

Je sais c'est pas forcement facile avec une partie du code, mais la il est vraiment long, avec le cadre resizable et tout, c'est un peu compliqué....
Bon sinon, en fait je pense que le probleme se situe au niveau du div global. Le div menu passe bien et le contenu est ok aussi. Par contre le div global va pas jusqu'en bas sous firefox, mais sous ie.
j'ai essayé de rajouter le padding-bottom... marche pas...

Franchement, il peut y avoir 15 raisons différentes, et je n'ai pas le courage d'examiner la CSS pour essayer de deviner ce qu'il y a dans le code HTML.
Une page en ligne, ou le code d'une page reproduisant le problème (même en plus "light"... surtout en plus light !), et je me penche sur le problème...

Alan proposait de rajouter un padding-bottom: 1px; afin, à ce que je devine, d'éviter des problèmes de fusion des marges. Si ça ne marche pas, il faut sans doute chercher ailleurs.

Ca y est c'est bon!!! j'ai trouvé...
Il y avait un overflow hidden en trop!

Merci en tous cas. je sais c'était pas facile comme ça, mais vraiment y'avait trop trop de code.
Courage pour votre continuation.