| <!DOCTYPE html> |
| <!-- contain:paint establishes a containing block for out-of-flow positioned descendants. --> |
| <div id="containPaint" style="contain:paint;"> |
| <div id="test1"></div> |
| </div> |
| <!-- contain:layout establishes a containing block for out-of-flow positioned descendants. --> |
| <div id="containLayout" style="contain:layout;"> |
| <div id="test2"></div> |
| </div> |
| <!-- contain:style does NOT establish a containing block for out-of-flow positioned descendants. --> |
| <div id="containStyle" style="contain:style;"> |
| <div id="test3"></div> |
| </div> |
| <!-- contain:size does NOT establish a containing block for out-of-flow positioned descendants. --> |
| <div id="containStyle" style="contain:size;"> |
| <div id="test4"></div> |
| </div> |
| <script src="../../../resources/testharness.js"></script> |
| <script src="../../../resources/testharnessreport.js"></script> |
| <script> |
| test(function() { |
| assert_equals(document.getElementById("test1").offsetParent, document.getElementById("containPaint")); |
| }, "inside contain:paint"); |
| test(function() { |
| assert_equals(document.getElementById("test2").offsetParent, document.getElementById("containLayout")); |
| }, "inside contain:layout"); |
| test(function() { |
| assert_equals(document.getElementById("test3").offsetParent, document.body); |
| }, "inside contain:style"); |
| test(function() { |
| assert_equals(document.getElementById("test4").offsetParent, document.body); |
| }, "inside contain:size"); |
| </script> |