tailwindlabs
Support of max-width container queries
This PR implements support of max-width container queries using @max or atMax variants.
There are two variants because combination of arbitrary container sizes and named containers are not supported by the current default extractor. To support that case the atMax variant has been introduced (although the @max variant would be syntactically better and more aligned with the rest of the module).
README.md contains the usage including the edge case which is only supported by atMax. Unit tests has been added as well.
Thanks guys, you are really doing a good job with Tailwind CSS.
Great addition! Not sure why this hasn't been approved yet!
Tested it and works great, even when adding multiple container queries for a min & max effect.
This simple addition has cleaned up my code immensely.
auction-card @[45rem]/auctions:@max-4xl/auctions:auction-card--wide
Tested it with arbitray values, as well as with base container queries
@adamwathan not sure if it's acceptable practice to tag the core team on PRs, but I feel like this may have gone unnoticed and would be a great addition to the plug-in
This would help a lot. Congrats on your implementation! 👏🏽 @pbabcsany
Without this feature it is still possible to achieve the needs of the breakpoint, we need to "inverse the logic".
@adamwathan Can we get this merged in? Without this, hiding columns as a table gets smaller requires somewhat ridiculous classes.
Any updates on this?
It is included in the new version of tailwind I believe so this repo will officially be abandoned in favor of the main tailwind repo I believe. I could have read that wrong though, but I'm pretty sure!
@ConnorMoodyDev In which tailwind version will this be included? I don't see it yet.
@florianjuengermann I think @ConnorMoodyDev is referring to container, but it's not the same as @tailwindcss/container-queries.
@ConnorMoodyDev In which tailwind version will this be included? I don't see it yet.
https://tailwindcss.com/blog/tailwindcss-v4-alpha
This will be included in V4
Container queries in core — we’ve added support for container queries directly to core, with new @min-* and @max-* variants to support container query ranges.