How to declare CSS values with fallbacks when a value is unsupported



I want to use

overflow: overlay

in chrome, but

overflow: scroll

in firefox. if I declare only the overlay value, then firefox would not scroll at all. I know that overlay is not standard but this shall be perfectly irrelevant for now.

my question is, which is the best way to have each browser the value as described.

is it possible to have a fallback inside CSS alone? cannot think that there is, but maybe there is a trick.

if it requires javascript, how would I test for the availability of the overflow value?

Answer

You just supply both of them, the browser will use the last recognized one.

Or you might want consider apply different styles for different browsers https://www.browserstack.com/guide/create-browser-specific-css



Source: stackoverflow