Closed
Description
When we have nested containers, with different contained axes, do we only query the nearest container -- or do we query the nearest container which has the proper containment? For example:
<style>
@container (block-size >= 100px) {
p { background: green; }
}
</style>
<html style="contain: size layout style; block-size: 200px;">
<main style="contain: inline-size layout style">
<p>query</p>
</main>
</html>
- If we query the nearest ancestor that is a container (
main
), the match isfalse
because the block-size is not contained, and cannot be queried - If we look for the nearest ancestor with block containment (
html
), the match istrue
because the block size matches the given condition
I think in this case we want option 2, and should only consider an ancestor to be "a container" if it meets all the required containment criteria. But maybe I'm missing something?