Status: PASS | Duration: 8ms | Subtests: 1/1 | Open test on wpt.live | Open ref on wpt.live | wpt.fyi
/css/css-conditional/container-queries/svg-foreignobject-no-size-container.html
<!doctype html> <title>CSS Container Queries Test: SVG <foreignObject> element not a size query container</title> <link rel="help" href="https://drafts.csswg.org/css-conditional-5/#size-container"> <link rel="match" href="svg-foreignobject-no-size-container-ref.html"> <style> foreignObject { display: block; width: 100px; height: 100px; container-type: size; } @supports not (container-type: size) { div { color: red; } } @container (width = 100px) { div { color: red; } } </style> <p>You should see the word PASS below and no red.</p> <svg> <foreignObject> <div id="div">PASS</div> </foreignObject> </svg>
/css/css-conditional/container-queries/svg-foreignobject-no-size-container-ref.html
<!doctype html> <title>CSS Test Reference</title> <p>You should see the word PASS below and no red.</p> <svg><foreignObject style="width:100px;height:100px;"><div>PASS</div><foreignObject></svg>