With container-name
The container-name specifies the name of the container element.
Syntax:
/* A single name */container-name: webLayout;/* Global Values */container-name: inherit | initial | revert | revert-layer | unset;
How to use @container Property in CSS ?
The @container CSS at-rule is a conditional group rule that styles a container context. A condition filters style declarations, which are applied to the container if the condition is true. The condition is evaluated whenever the container size or <style-feature> value changes.
Table of Content
- Using @container (container-condition):
- Values (container-name, container-query)
- Using and, or, not keywords
- With container-name
- Nested Container Queries
- Browser Compatibility