28220 sujets

CSS et mise en forme, CSS3

Bonjour,

Ce sujet est récurrent, mais je n'ai pas trouvé de réponses sur le forum.

Je souhaiterais, dans une structure classique à 3 colonnes, mettre, dans la div centrale, 2 blocs côte à côte prenant tout l'espace disponible.
J'ai donc fais quelque chose comme ceci :

<div id="conteneur">
  <div id="entete"></div>
  <div id="gauche"></div>
  <div id="droite"></div>
  <div id="centreDeuxCol">
    <p id="ariane"></div>
    <div id="monConteneur">
      <div style="float:left; width:49%;">bloc gauche</div>
      <div style="float:right; width:49%;">bloc droit</div>
    </div>
  </div>
  <div id="pied"></div>
</div>


Toutefois, sous IE5, les % semble être calculé en fonction du body (ou de la taille de la fenêtre), alors que je souhaite qu'ils soient calculés en fonction de monConteneur.

Quelqu'un à t-il une solution simple. Un Hack ?
Modifié par vinzo (10 Mar 2005 - 09:24)
Le problème provient du fait que monConteneur n'a pas de taille définie.
Lorsque je le passe à 99%, tout se passe bien (IE 5, 6 et FFx).
Mais si je le passe à 100% c'est sous IE6 que cela ne fonctionne plus.

Une suggestion ?
Merci Stephan, merci Raphael.

Le conteneur de mes "deux colonnes" a besoin d'une dimension explicite.
Ensuite, je crois effectivement qu'il y a un problème de calcul d'arrondis que l'on peut résoudre par un... 99%. C'est une très légère concession.

Merci pour vos contributions.
Modifié par vinzo (10 Mar 2005 - 09:24)
99% résout peut-être le problème sur « ton » navigateur avec « ta » résolution d'écran, mais au redimensionnement de la fenêtre, le problème va et vient.

Il faut faire le test avec : The 1 Pixel Rounding Error Problem en changeant la taille de la fenêtre. C'est là et seulement là que l'on peut voir l'ampleur du problème...
Modifié par Stephan (10 Mar 2005 - 16:43)