Sizing keywords supported? about cq-prolyfill HOT 3 CLOSED

What do you mean by supported? Can you give an example?

width: min-content and width: max-content doesn’t get recognized currently. But it should be easy to add rules for it to the isIntrinsicSize() function.

If column-width works correctly or not, depends on the use-case I think. If an element with a column-width gets used as the container for a query the results are probably incorrect.

from cq-prolyfill.

Yeah, what I was wondering specifically was whether I could do something like .btn-toolbar:container(width < max-content) { /* styles that collapse buttons into a dropdown menu */ }. Now that I think that through more, though, doing something like that would change the value of max-content so it wouldn't work the way I'd want it to anyway (if it didn't just blow up altogether. 😏).

I'm trying to get my head around how we could use element/container queries for a project I'm working on. Haven't had time to actually try cq-prolyfill out yet, just wanted to understand what the possibilities are. :) Thanks!

from cq-prolyfill.

Now that I think that through more, though, doing something like that would change the value of max-content so it wouldn't work the way I'd want it to anyway (if it didn't just blow up altogether. 😏).

Yeah, that could end in an endless loop, which is one of the issues this proposal/prolyfill tries to prevent.

Haven't had time to actually try cq-prolyfill out yet, just wanted to understand what the possibilities are.

I think the most common use cases should be covered by the demo.

from cq-prolyfill.