diff options
Diffstat (limited to 'testing/web-platform/tests/css/css-contain/contain-size-replaced-003c.html')
-rw-r--r-- | testing/web-platform/tests/css/css-contain/contain-size-replaced-003c.html | 50 |
1 files changed, 50 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-contain/contain-size-replaced-003c.html b/testing/web-platform/tests/css/css-contain/contain-size-replaced-003c.html new file mode 100644 index 0000000000..9018eaa685 --- /dev/null +++ b/testing/web-platform/tests/css/css-contain/contain-size-replaced-003c.html @@ -0,0 +1,50 @@ +<!DOCTYPE html> +<meta charset="utf-8"> +<title>CSS Containment Test: intrinsic size of size-contained replaced elems, with explicit max-content height</title> +<link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com"> +<link rel="author" href="https://mozilla.org" title="Mozilla"> +<link rel="help" href="https://drafts.csswg.org/css-contain/#containment-size"> +<link rel="match" href="contain-size-replaced-003-ref.html"> +<meta name=assert content="This test checks that various size-contained replaced elements have an intrinsic size of 0,0 regardless of their content."> +<style> + video, audio, canvas, svg, img, embed, object, iframe { + border: 3px solid teal; + contain: size; + margin: 15px; + height: max-content; /* This means 0, given 'contain:size'. */ + width: auto; + } +</style> +<body> + <!-- video element: --> + <video></video> + <video controls></video> + <video poster="support/blue-100x100.png"></video> + <video poster="support/blue-100x100.png" controls></video> + <video src="support/white.webm" controls></video> + <video src="support/white.webm" controls></video> + <br> + + <!-- audio element with controls, and a few other misc replaced elements: --> + <audio controls></audio> + <canvas></canvas> + <svg></svg> + <br> + + <!-- Image elements: --> + <img src="broken"> + <img src="support/blue-100x100.png"> + <picture><source srcset="support/blue-100x100.png"><img></picture> + <br> + + <!-- Document-embedding elements (with & without a target resource that + could provide an intrinsic ratio in some cases, in the absence of + contain:size): --> + <embed> + <embed src="support/blue-100x100.png"> + <object></object> + <object data="support/blue-100x100.png"></object> + <iframe></iframe> + <iframe src="support/blue-100x100.png"></iframe> + <br> +</body> |