align-items-static-position-002.tentative.html (1260B)
1 <!DOCTYPE html> 2 <title>Align-items doesn't apply to OOF elements of inline elements when statically positioned because they 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-002-ref.tentative.html"> 10 <link rel="stylesheet" href="/fonts/ahem.css"> 11 <style> 12 .inline { 13 display: inline; 14 color: transparent; 15 font: 10px Ahem; 16 line-height: 25px; 17 align-items: center; 18 justify-items: center; 19 } 20 21 .container { 22 border: 1px solid; 23 position: relative; 24 width: 100px; 25 height: 100px; 26 display: inline-block; 27 margin-left: 50px; 28 margin-bottom: 50px; 29 } 30 31 .abs { 32 width: 50px; 33 height: 50px; 34 position: absolute; 35 background: purple; 36 } 37 </style> 38 <div class="container"><div class="inline">text 39 <div class="abs"></div> 40 <br>text 41 </div></div>