@supports
Checks for browser support of specific CSS features and applies styles only if those features are available.
Quick example
@supports (display: grid) {
.container {
display: grid;
grid-template-columns: 1fr 1fr;
}
}
@supports not (display: grid) {
.container {
display: block; /* fallback for very old browsers */
}
}@supports Browser Support
Widely available Since 2015 96% global usage
This feature is well established and works across many devices and browser versions. It has been available across browsers since 2015.
Safe to use without fallbacks.
28+
22+
9+
12+