container-query-polyfill
container-query-polyfill copied to clipboard
Requesting container height on container-type: inline-size
Using this polyfill I can request a container's height on a container-type: inline-size
:
.teaser {
container-type: inline-size;
}
@container (min-height: 530px) {
...
}
My understanding is that this request on the block-axis should only be possible if container-type: size;
.
Is the current behavior according to spec?
This is the part of the spec I am referring to: https://drafts.csswg.org/css-contain-3/#container-type
size: Establishes a query container for container size queries on both the inline and block axis. inline-size: Establishes a query container for container size queries on the container’s own inline axis.
Chrome's native implementation does not follow a height-request on a container-type: inline-size
, but the polyfill does.
Not that I'm complaining, I just want to write CSS that works for native implementations in future. And this is at least a gotcha.
Thank you for your issue!
The newest version of the polyfill (currently in alpha) more closely follows the spec, and does not allow you to query e.g. block-size
on an inline-size
container.