The @supports
CSS at-rule lets you specify declarations that depend on a browser’s support for one or more specific CSS features. The rule may be placed at the top level of your code or nested inside any other conditional group at-rule.
Example
<div class="my-test">Hello</div>
@supports (display: flex) {
.my-test {
color: red;
}
}
@supports (display: i-made-this-up) {
.my-test {
text-decoration: underline;
}
}
Result
Hello