Far from being ready when only one major browser supports it. If you want this, you should vote for it to be focused on for interop-2026 https://github.com/web-platform-tests/interop/issues Right now, the leading CSS proposals are `@container style()`, `corner-shape` and `break-after` https://foolip.github.io/interop-reactions/
CSS now has an if() conditional function
31–40 of 245 posts
Re: CSS now has an if() conditional function
#32Re: CSS now has an if() conditional function
#33I'm not sure turning CSS into a full blown language is a good idea. With all the cascading in place, it is already a bit hard to determine why certain styles are applied. Now with this, we will be spending more brain cells debugging CSS issues.
Re: CSS now has an if() conditional function
#34This is missing a "if variable equals" imho. Right now it seems like pure syntactic sugar for a media query.
This is exactly what it does not need. SASS style conditional CSS is a complete nightmare to maintain. The declarative nature is one of its greatest strengths.
Re: CSS now has an if() conditional function
#35This is missing a "if variable equals" imho. Right now it seems like pure syntactic sugar for a media query.
>This is missing a "if variable equals" imho. This is exactly what it does not need. SASS style conditional CSS is a complete nightmare to maintain. The declarative nature is one of its greatest strengths.
if(style(--foo: bar): baz)
Is how you test if variable --foo is equal to "bar"
See https://developer.mozilla.org/en-US/docs/Web/CSS/Reference/V...
Re: CSS now has an if() conditional function
#36It's a great way to make conditional styles without having to use JavaScript; however, having used JS for years to make theme color and icon sets that rely on CSS properties, I'm not sure I particularly like this method. I feel like you have to smear a lot of logic across your CSS whereas with JS you can reduce your theme to a data structure and just have a simple function to setup all the CSS variables based on that…
Javascript always suffer from FOUC problem though (Unless it's server side). Although the if() css function seems to just be syntax suger of standard @media query. So it doesn't really add anything to solve existing problems. Edited: It seems it can also be toggled from css variable? So it might actually fix some existing problems.
Considering the kinds of crap that have been done with headers...
Re: CSS now has an if() conditional function
#37I'm not sure turning CSS into a full blown language is a good idea. With all the cascading in place, it is already a bit hard to determine why certain styles are applied. Now with this, we will be spending more brain cells debugging CSS issues.
css definitely shouldn't have backwards branches (loops/recursive functions), but adding a little more power can clean up expression a ton and make reading/applying that much faster
I will kiss the feet of the whatwg groups if they do this.
PS: Would also love to have declarative template inclusion now that removal of XSLT has also removed this facility from the browser.
Re: CSS now has an if() conditional function
#38Earlier quoted context omitted.
lol. What other browser vendors? Whatwg is just google is a trench coat. Edge is chrome. Firefox is funded by Google. So I guess apple who's main contribution is being years behind and having half their stuff be broken
There's this really cool site where you can see how well supported a feature is: https://caniuse.com/?search=if If Google controls everything, why is if() only supported on 59% traffic? Do you think any serious company will let their site break on 40% of clients? Do you think Apple's opinion is unimportant?
Re: CSS now has an if() conditional function
#39Not supported in Firefox and Safari. Also it seems most people forget that the more bloated the web platform is, the more resources are needed to develop and maintain a web browser engine.. Chromium is open-source, but it's already expensive to maintain a fork or even rebuild it..