Providing a wide range of support for the browsers is great problem to ponder upon when it comes to designing websites using CSS. For instance, there are still a few sets of browsers that don’t support flexbox yet.
Luckily, CSS comes with a handly little utility using which it’s easier to determine whether the client browser supports a certain CSS feature or not, and based on that it would render the CSS.
So, for instance, if you want to run a block of CSS only when the browser supports display: flex, you can do it like so.
And if the browser doesn’t support display: flex, it’s easier to fall back to the alternative solution by using the not operator with @supports like so.
Achieve superior email deliverability with ToastMail! Our AI-driven tool warms up inboxes, monitors reputation, and ensures emails reach their intended destination. Sign up today for a spam-free future.