summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/css/css-contain/contain-paint-clip-019.html
diff options
context:
space:
mode:
Diffstat (limited to 'testing/web-platform/tests/css/css-contain/contain-paint-clip-019.html')
-rw-r--r--testing/web-platform/tests/css/css-contain/contain-paint-clip-019.html37
1 files changed, 37 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-contain/contain-paint-clip-019.html b/testing/web-platform/tests/css/css-contain/contain-paint-clip-019.html
new file mode 100644
index 0000000000..34b12642db
--- /dev/null
+++ b/testing/web-platform/tests/css/css-contain/contain-paint-clip-019.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+
+<meta charset="UTF-8">
+
+<title>CSS Containment Test: 'contain: paint' and clipping prevents scrollbars</title>
+
+<link rel="author" title="Vladimir Levin" href="mailto:vmpstr@chromium.org">
+<link rel="help" href="https://www.w3.org/TR/css-contain-1/#containment-paint">
+<link rel="match" href="reference/contain-paint-clip-019-ref.html">
+
+<meta content="This test checks that the paint containment of an element clips contents.
+ It should also prevent layout overflow from being propagated to ancestors." name="assert">
+
+<style>
+ #container {
+ contain: paint;
+ width: 100px;
+ height: 100px;
+ }
+ #green {
+ background-color: green;
+ width: 100px;
+ height: 100px;
+ }
+ #red {
+ background-color: red;
+ width: 100px;
+ height: 10000px;
+ }
+</style>
+
+<p>Test passes if there there is a green square. No red and no scrollbars should be visible.</p>
+
+<div id="container">
+ <div id="green"></div>
+ <div id="red"></div>
+</div>