CSS box sizing

Das CSS box sizing Modul ermöglicht es Entwicklern, festzulegen, wie Elemente ihren Inhalt anpassen oder in einen bestimmten Layout-Kontext passen. Es definiert Größen-, Mindestgrößen- und Maximalgrößen-Eigenschaften und erweitert außerdem die CSS-Größeneigenschaften durch Schlüsselwörter, die größenbasierte intrinsic size und kontextbasierte extrinsic Größe repräsentieren.

Elemente können entweder extrinsisch oder intrinsisch skaliert werden. Das CSS-Boxmodell definiert seitenrelative Eigenschaften, um die Größe eines Elements explizit oder „extrinsisch“ festzulegen, einschließlich der Eigenschaften width, height, padding und margin (zusammen mit den border-Eigenschaften, die im CSS Hintergründe und Grenzen Modul definiert sind). Dieses CSS box sizing Modul erweitert das CSS-Boxmodell-Modul, um einem Element zu ermöglichen, intrinsisch skaliert zu werden – die Größe des Elements auf Basis der Größe seines Inhalts festzulegen.

Die in diesem Modul eingeführten Größenwerte ermöglichen es Elementen mit size containment, explizite intrinsische Größen anzunehmen, als ob die Breite und Höhe ihres in den Fluss eingebetteten Inhalts der angegebenen expliziten intrinsischen Größe entspricht, anstatt so skaliert zu werden, als ob sie leer wären.

Dieses Modul führte auch die Möglichkeit ein, ein Seitenverhältnis für den Kasten eines Elements zu definieren, was bedeutet, dass der Browser die Abmessungen eines Elements automatisch anpassen kann, um ein angegebenes Seitenverhältnis zu wahren, solange eine der Abmessungen automatisch skaliert wird.

Das modul für logische Eigenschaften und Werte erweiterte die im Boxmodell und im box sizing Modul verfügbaren Eigenschaften um schreibmodus-relative Äquivalente der entsprechenden physischen Boxmodells- und intrinsischen Boxgrößeneigenschaften.