Discussion :

[Bovino]

Pascale Lambert continue sa série et nous propose un nouvel article sur le CSS, destiné aux débutants, dans lequel elle nous montre comment bien gérer les marges en CSS.

N'hésitez pas à faire part de vos remarques, questions et encouragements à la suite de ce message.

Voir aussi les cours et tutoriels CSS.

Merci à elle

[xwz]

Petit détail à ne pas oublier pour la partie "Le modèle des boites (box model)" : Sur firefox le padding l'ajoute aux width/height mais sur internet explorer ce n'est pas le cas, donc dans l'exemple avec un width: 200; et padding: 40; sur firefox le bloc fait bien 280px avec une zone de texte de 200 mais sur internet explorer la zone de texte fait 120px et le bloc en fait 200.

Pour les autres navigateurs je ne me souviens plus trop, ça fait un moment que je n'ai pas fait de dev. web mais il me semble que internet explorer reste encore une fois la seule exception.

[Invité]

Il aurait été intéressant à mon avis de parler du concept de fusion des marges.
Beaucoup de gens y son confrontés sans le savoir, et cela reste un principe peu connu ( mais très important ) de la norme CSS.

[Kerod]

Il y a une petite suite qui traite du cas de la fusion des marges ou encore celui d'Internet Explorer : Débutant : Résoudre les problèmes de marges en CSS

[xwz]

bon, si elle a pensé à tout, je n'ai rien à ajouté, c'est parfait .

[Macmillenium]

Petit détail à ne pas oublier pour la partie "Le modèle des boites (box model)" : Sur firefox le padding l'ajoute aux width/height mais sur internet explorer ce n'est pas le cas

Si, c'est le cas.
C'est en mode de rendu Quirks qu'IE utilise son propre modèle de boite (celui que tu décrives).