summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/html/semantics/popovers/popover-stacking-context.tentative.html
diff options
context:
space:
mode:
Diffstat (limited to 'testing/web-platform/tests/html/semantics/popovers/popover-stacking-context.tentative.html')
-rw-r--r--testing/web-platform/tests/html/semantics/popovers/popover-stacking-context.tentative.html34
1 files changed, 34 insertions, 0 deletions
diff --git a/testing/web-platform/tests/html/semantics/popovers/popover-stacking-context.tentative.html b/testing/web-platform/tests/html/semantics/popovers/popover-stacking-context.tentative.html
new file mode 100644
index 0000000000..b5d0d651d3
--- /dev/null
+++ b/testing/web-platform/tests/html/semantics/popovers/popover-stacking-context.tentative.html
@@ -0,0 +1,34 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<link rel="author" href="mailto:masonf@chromium.org">
+<link rel=help href="https://open-ui.org/components/popup.research.explainer">
+<link rel=match href="popover-stacking-context-ref.tentative.html">
+
+<div popover>
+ Inside popover
+ <div class=z style="z-index: 2; background:lightgreen">z-index 2
+ <div class=z style="z-index: 3; background:lightblue; left: 20px;">z-index 3</div>
+ <div class=z style="z-index: 1; background:pink; top:-20px; left: 10px;">z-index 1</div>
+ </div>
+ <div class=z style="background:green; top:-100px; left: 250px; width: 100px;">Outside</div>
+ Bottom of popover
+</div>
+
+<style>
+ [popover] {
+ width: 200px;
+ height: 230px;
+ border: 1px solid red;
+ top:50px;
+ left:50px;
+ }
+ .z {
+ position: relative;
+ border: 1px solid black;
+ padding: 1em;
+ }
+</style>
+
+<script>
+ document.querySelector('[popover]').showPopover();
+</script>