Pourquoi les marges et les remplissages CSS sont-ils calculés par rapport à la largeur ?

Pourquoi les marges et les remplissages CSS sont calculés par rapport à la largeur

Dans le domaine du CSS, une bizarrerie intrigante surgit : les marges et les remplissages sont toujours calculé par rapport à la largeur du bloc contenant. Cette décision de conception énigmatique va à l'encontre des attentes intuitives, soulevant la question : pourquoi ?

La spécification du modèle de boîte CSS indique que "le pourcentage de [marge] est calculé par rapport à la largeur du bloc contenant la boîte générée". Cette incohérence s'étend à « marge supérieure » ​​et « marge inférieure », rendant potentiellement les mises en page indéfinies si la largeur du bloc contenant dépend de l'élément en question.

Pourquoi alors, une approche aussi non conventionnelle serait-elle adoptée ? Bien qu'aucune réponse définitive n'existe, des conjectures infondées suggèrent que la clé réside dans la détermination de la hauteur des éléments.

La hauteur des éléments est souvent définie par la hauteur de ses éléments enfants. Si un élément parent devait avoir un rembourrage supérieur (par rapport à la hauteur du parent), cela aurait un impact sur la hauteur totale du parent. Cependant, comme la taille de l'enfant dépend du parent, une dépendance circulaire s'ensuivrait.

Ce problème de dépendance s'étend au-delà du cas de confinement direct (parent décalé === parent). La hauteur de l'élément feuille (enfant sans enfants) affecte tous les éléments situés au-dessus. Par conséquent, ce choix de conception garantit la cohérence et évite les erreurs potentielles de calcul de la hauteur.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!