align-self-with-flex-grid-parent-ref.html (669B)
1 <!DOCTYPE html> 2 <link rel="author" title="David Shin" href="mailto:dshin@mozilla.com"> 3 <link rel="help" href="https://drafts.csswg.org/css-position-3/#abspos-layout"> 4 <meta name="assert" content="Ensures that absolutely positioned elements with non-auto inset are w.r.t. absolute contain block."> 5 <style> 6 .container { 7 position: relative; 8 width: 300px; 9 height: 300px; 10 background: purple; 11 } 12 13 .abs { 14 position: absolute; 15 width: 100px; 16 height: 100px; 17 inset: 0; 18 align-self: center; 19 justify-self: center; 20 background: pink; 21 } 22 </style> 23 24 <div class="container"> 25 <div class="abs"></div> 26 </div> 27 <br> 28 <div class="container"> 29 <div class="abs"></div> 30 </div>