CSS if() style query not working like @container style query
In this codepen, I tried to use the new
=> if I do
)
Does anybody know why or what I am missing?
=> Here is a small codepen that illustrates my issue
(If I understand the official documentation, it should work as I expect https://www.w3.org/TR/css-contain-3/#typedef-style-feature)
if() css function but it seems like the style query used for it cannot be used with declarations like it should=> if I do
style(color: red) it doesn't work but if I use custom props instead : style(--color: red), everything works well. (this is exactly the same with @container style queries but on mdn or in this article it seems like it should have been possible )Does anybody know why or what I am missing?
=> Here is a small codepen that illustrates my issue
(If I understand the official documentation, it should work as I expect https://www.w3.org/TR/css-contain-3/#typedef-style-feature)
Chrome for Developers
Style queries allow developers to query a parent element's style values using the @container rule. In Chrome 111, style queries for CSS custom properties are landing stable. Learn how to get started with them.
