CSS/Eigenschaften/container-type
Aus SELFHTML-Wiki
< CSS | Eigenschaften
Die Eigenschaft container-type legt das Element als Abfragecontainer für die Zwecke von Containerabfragen fest und ermöglicht es Stilregeln, die seine Nachkommen stylen, verschiedene Aspekte seiner Größe, seines Layouts und seines Stils abzufragen und entsprechend zu reagieren
- Erlaubte Werte
- none
- style
- state
- size
- inline-size
- block-size
- Vererbung steuernde Werte
inherit
,initial
,unset
undrevert
- Defaultwert
none
- anwendbar auf
alle Elemente
- Vererbung
nein
- animierbar
nein
Beispiel
main {
container-type: size;
container-name: page-layout;
}
.my-component {
container-type: inline-size;
container-name: component-library;
}
@container page-layout (block-size > 12em) {
.card { margin-block: 2em; }
}
@container component-library (inline-size > 30em) {
.card { margin-inline: 2em; }
}
.
Siehe auch
Weblinks
- Spezifikation (CSSWG): container-type CSS Containment Module Level 3
- Details: caniuse.com