Pourquoi n'avons-nous pas box-sizing: margin-box;
? Habituellement, lorsque nous insérons box-sizing: border-box;
nos feuilles de style, nous entendons vraiment les premières.
Exemple:
Disons que j'ai une mise en page à 2 colonnes. Les deux colonnes ont une largeur de 50%, mais elles ont l'air plutôt moche car il n'y a pas de gouttière (espace au milieu); Voici le CSS:
.col2 {
width: 50%;
float: left;
}
Pour appliquer une gouttière, vous pourriez penser que nous pourrions simplement définir une marge droite sur la première des 2 colonnes; quelque chose comme ça:
.col2:first-child {
margin-right: 24px;
}
Mais cela ferait en sorte que la deuxième colonne s'enroule sur une nouvelle ligne, car ce qui suit est vrai:
50% + 50% + 24px > 100%
box-sizing: margin-box;
résoudrait ce problème en incluant une marge dans la largeur calculée de l'élément. Je trouverais cela très utile sinon plus utile que box-sizing: border-box;
.
border: xxx solid transparent;
, car la bordure est incluse dans border-box
. Cela cassera cependant d'autres choses, telles que box-shadow
.
box-sizing: margin-box
parce que cela ne fonctionnerait pas avec l'effondrement des marges.
box-sizing: margin-box;
?" Parce que si les marges horizontales ne s'effondrent pas, une telle proposition interférerait sérieusement avec l'effondrement vertical des marges. Quoi qu'il en soit, si vous souhaitez proposer quelque chose pour la standardisation, Stack Overflow n'est pas le bon endroit. Essayez les listes de diffusion.