align-items-static-position-001.tentative.html (1180B)
1 <!DOCTYPE html> 2 <title>Align-items only applies to OOF elements of block elements when statically positioned if it would apply if not OOF.</title> 3 <link rel="author" title="Alison Maher" href="mailto:almaher@microsoft.com"> 4 <link rel="help" href="https://drafts.csswg.org/css-align-3/#valdef-align-self-auto"> 5 <link rel="help" href="https://drafts.csswg.org/css-align-3/#valdef-justify-self-auto"> 6 <link rel="help" href="https://drafts.csswg.org/css-position-3/#abspos-alignment"> 7 <link rel="help" href="https://issues.chromium.org/issues/409806799"> 8 <link rel="help" href="https://github.com/w3c/csswg-drafts/issues/12121"> 9 <link rel="match" href="align-items-static-position-001-ref.tentative.html"> 10 <style> 11 .block { 12 display: block; 13 width: 75%; 14 height: 75%; 15 border: 5px dotted blue; 16 align-items: center; 17 justify-items: center; 18 } 19 20 .container { 21 border: 1px solid; 22 position: relative; 23 width: 100px; 24 height: 100px; 25 display: inline-block; 26 margin-left: 50px; 27 margin-bottom: 50px; 28 } 29 30 .abs { 31 width: 50px; 32 height: 50px; 33 position: absolute; 34 background: purple; 35 } 36 </style> 37 <div class="container"><div class="block"> 38 <div class="abs"></div> 39 </div></div>