Firefox interprete mal le padding pour 2 boites left et right [Résolu]

Bonjour,

Pour une fois, c'est pas IE qui bugge mais bel et bien Firefox.
Présentation :

Un <div> de largeur 100% englobe 2 <div> de largeur 50%.
Si je mets un padding à l'un des 2 div fils, Firefox me met le second à la ligne.
Si pas de padding, tout est ok... comment faire ?
Bien entendu, je souhaiterais garder ces valeurs en pourcentage, et ne mettre qu'en pixels la valeur du padding.

Code :

<div id="pere">
  <div class="left">blablabla</div>
  <div class="right">blablabla</div>
</div>

CSS:

#pere{ width: 100%; position: relative;}

.left{position: relative; float: left; width: 50%; padding: 5px;}
.right{position: relative; float: right; width: 50%; padding: 5px;}

Ou peut-être qu'on ne peut pas mélanger les '%' avec les pixels...

Merci pour votre réponse.
lolo.
Modifié par loloajax (16 Nov 2005 - 14:59)

bonjour loloajax, et bienvenu
je ne suis pas trop d'accord avec le

a écrit :
Pour une fois, c'est pas IE qui bugge mais bel et bien Firefox

.
Ton problème est en fait une différence entre les navigateurs au niveau du calcul des dimensions des boîtes.
Tu trouveras l'explication dans cet article:
http://www.openweb.eu.org/articles/dimensions_boites_css/

Bonne journée

Julien

Effectivement c'est bien FF qui applique correctement CSS2 et non pas IE.

Ce problème a déjà été posé et résolu sur ce sujet.

Merci pour toutes ces réponses !! Et en plus, quelle rapidité...

J'ai opté pour la solution d'appliquer directement le padding au contenu des 2 div fils et çà marche impeccable !


lolo

Bravo,

Un ptit [Résolu] pour fêter ça ?

Voilà chef !