u/pnwstarlight

I recently stumbled upon the CSS if() function. For me, being able to use media queries within the declaration block is pretty much the last reason to use SASS and with the if() function I would be able to write my stuff in pure CSS without any preprocessor.

section.main-content {
    padding: if(
        media(width &lt; 600px): 5px;
        media(width &lt; 1200px): 10px;
        else: 20px;
    );
}

As of right now, browser support is pretty meh. While it's been implemented in Chrome and Edge for about a year, Firefox, Safari and Samsung do not support it.

I am about to start coding a smol fun project and I was considering to just yolo it and use this new feature, even if it means that it won't be useable for 30% users for a couple months.

But are experimental CSS features guaranteed to eventually make it to all major browser at all? Or is it possible that two years from now, Firefox and Safari still haven't adopted this?

if() function - Are new CSS features guaranteed to eventually be supported in all major browser?