18073 sujets

Questions générales et questions de débutants

[RESOLU] Pb entre IE et Firefox

Bonjour,

J'ai du mal sur une mise en page entre IE et fire fox sur la largeur de mon centre.
quelqu'un voit il mon erreur et la raison...

 #conteneur {
 
 width: 1000px;
 margin-top: 0px;
 }

 #body {
padding:20px;
 position: absolute;
 width: 800px;
 margin-top: 20px;
 border:2px solid #000000;

 }
#centre
{border:2px solid #000000;
 margin-left: 170px;
 padding-left: 10px;
 padding-right: 10px;
 padding-top: 10px;
 padding-bottom:10px;
 width:580px;
 background: #FFFFFf;
}
#cadre_G
{
 float:left;
 
 width:155px;
 
}
#menu_H_noir {
  
 background-color:#000000;
color:#ffffff;
 }


<div id="conteneur">
<div id="body">
<div id="cadre_G">
<div id="menu_H_noir">jjjjj</div> 
hhhhhbb<br>tyjjjjj</br>
</div>
<div id="centre">lllllllll</div>
</div>
</div>


Merci pour l'aide
Modifié par newto0 (16 Jan 2006 - 01:11)
Salut,

comme ton bloc#centre combine une largeur, une bordure et des padding alors tu aura ce genre de problème dans deux cas :

1. ton document n'a pas de doctype. Dans ce cas IE6 passe en mode quirck.

2. ton document est ouvert par une version antérieure à IE6

Dans les 2 cas Internet explorer appliquera le modèle de boite (box model) microsoft et non le modèle de boite standard.

Pour en savoir plus : http://www.openweb.eu.org/articles/dimensions_boites_css/
Si tu tentes de valider ta page, tu risques d'avoir des surprises !

L'élément <html> n'accepte à ce qu'il me semble que deux enfants, à savoir <head> et <body>. Ton <body> ne peut donc pas être contenu dans une <div> !

Un bloc de 1000px est trop large pour une résolution en 1024*768 (ben oui, les bordures de la fenêtre du navigateur, la barre de défilement.. tout ça peut facilement dépasser les 24 pixels... mieux vaut tabler sur 40 ou 50 pour avoir de la marge).
Si tu fais un site pour une résolution de 1024px ou supérieur (je comprends très bien cette tentation, mais ça exclut 20% des utilisateurs tout de même !), tu peux tabler sur du 900px de large, ça fait des petites marges très esthétiques et qui donnent une certaine respiration au contenu, ce qui est assez agréable.

Même chose pour un bloc de 800px de large: à plus de 760px de large, ça ne passe pas sur un écran en 800×600px !

Mais avant de choisir une largeur fixe (source de problèmes), il faut être sûr d'en avoir un besoin réel ! Si c'est juste pour pouvoir caser un bandeau d'en-tête en largeur fixe, c'est dommage...
Bonjour,

mpop a écrit :
Si tu tentes de valider ta page, tu risques d'avoir des surprises !

L'élément <html> n'accepte à ce qu'il me semble que deux enfants, à savoir <head> et <body>. Ton <body> ne peut donc pas être contenu dans une <div> !


Petite confusion : #body ne vise pas l'élément body, mais un élément <div id="body"> (il n'y a pas de mot-clés réservés en matière d'id ou de class en (X)HTML, ni en CSS).
Modifié par Laurent Denis (15 Jan 2006 - 14:59)
Laurent Denis a écrit :
Petite confusion : #body ne vise pas l'élément body, mais un élément <div id="body"> (il n'y a pas de mot-clés réservés en matière d'id ou de class en (X)HTML, ni en CSS).


Oups, my mistake... Smiley confused
Dès que j'ai vu marqué "body" j'ai cru avoir affaire à un élément <body>... faut dire qu'il ne m'est jamais venu à l'idée de nommer ainsi une <div> Smiley sweatdrop ... mais rien ne l'empêche, effectivement.

Du coup, le CSS fixe une largeur de la page (contenue dans div#conteneur) de 1000px... Le résultat risque d'être sympathique ! Smiley biggol
Tout est bon à présent merci

J'ai néanmoins un soucis avec les balises <li> le point sous Firefox est à l'extérieur gauche dans centre Smiley rolleyes 
#centre
{border:2px solid #000000;
 margin-left: 180px;
 width:580px;
 background: #FFFFFf;
}


PS: pour les dimensions Le site va fonctionner sur du 800 les 200px restants sont prévus pour une future partie droite moins importantes et non essentiel par rapport au contenu.(pub ou autre)
Modifié par newto0 (16 Jan 2006 - 00:57)
Sujet clos
Aller à