ceci est simple,
Tu as oublié de specifier un doctype sur ta page HTML.
Le doctype est le document qui va spécifier au navigateur, voila, j'ai fait mon site correctement, donc tu dois te conformer à ce document. En plus simple, le doctype est obligatoire pour un site en xHTML. Et il permet d'eviter bien des déboires.
Petite lecture sur le doctype : http://pompage.net/pompe/doctype/
Ensuite pourquoi IE se comporte différemment que firefox ?
Il y a deux modes de comportement pour les navigateurs :
-Le mode quirks qui est un mode de compatibilité
-Le mode strict qui est un mode conforme aux standards du W3C
En plus de ce mode de comportement, il y a une chose importante à savoir, c'est le modele de boite.
Imagine ton div comme une boite, sur cette boite tu peux lui indiquer des parametres de dimension et des marges et des bordures.
Dans l'ordre et partant de l'exterieure vers l'intérieur on a :
margin, border, padding, puis le contenu.
Il existe 2 modèles de boites : le modele microsoft et le modele W3C.
Le modele microsoft est différent du modele de boite du W3C.
Lorsque l'on spécifie une largeur sur un div, cette largeur est appliquée à l'exterieure des bordures.
si mon div a les parametres suivants :
border:10px; padding:10px; width:100px.
Mon div fera 100px de large.
Dans le modele de boite W3C, la largeur s'applique à l'intérieure du contenu.
si mon div a les parametres suivants :
border:10px; padding:10px; width:100px.
Mon div fera 140px de large (10+10+100+10+10).
Mais quel est le lien entre le modele de boite et le mode de rendu ?
En fait c'est simple, lorsque IE est en mode quirks (doctype manquant ou foireux) il applique le modele de boite microsoft sur les blocks (c'est ce qui t'arrive), mais en mode strict, il applique le modele de boite W3C.
Il faut savoir que tous les autres navigateurs (opera, konqueror, safari, firefox) opteront pour le modèle de boite W3C.
C'est exactement ce qui arrive dans ton exemple.
Donc il te faut absoluement commencer avec un bon doctype, prend du xHTML transitionnal ca suffira.
PS: IE a une autre particularité chiante (et c'est pareil pour IE7). Meme si un doctype est bon, (genre xHTML 1.0 transtiionnal....), SI on a quelque chose autre qu'un espace avant le doctype, IE repasse automatiquement en mode quirks.
PS2: Si une page est en mode quirks, IE7 se comporte exactement comme IE6, c'est une politique de microsoft et je les comprend car 90% des sites webs sur le net sont pourris et ne passeraient pas correctement sous IE7.
Message édité par gatsu35 le 07-12-2006 à 03:17:30