stacking-context-002.html (789B)
1 <!DOCTYPE html> 2 <title>CSS Test: Individual transform properties create stacking context</title> 3 <link rel="author" title="Oriol Brufau" href="obrufau@igalia.com"> 4 <link rel="help" href="https://www.w3.org/TR/css-transforms-2/#individual-transforms"> 5 <link rel="match" href="../../reference/ref-filled-green-100px-square.xht"> 6 <meta name="assert" content=" 7 Setting `rotate` to a value different than `none` establishes a stacking context. 8 "> 9 10 <style> 11 .transform { 12 width: 100px; 13 height: 100px; 14 background: red; 15 rotate: 0deg; 16 } 17 .child { 18 width: 100px; 19 height: 100px; 20 background: green; 21 position: relative; 22 z-index: -1; 23 } 24 </style> 25 26 <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> 27 <div class="transform"> 28 <div class="child"></div> 29 </div>