position-absolute-011.html (841B)
1 <!DOCTYPE html> 2 <title>abspos items</title> 3 <link rel="author" title="David Grogan" href="mailto:dgrogan@chromium.org"> 4 <link rel="help" href="https://drafts.csswg.org/css-flexbox/#abspos-items"> 5 <link rel="match" href="/css/reference/ref-filled-green-100px-square.xht"> 6 <link rel="bookmark" href="https://crbug.com/1066859"> 7 <meta name="assert" content="Flex sets correct static position for abspos item when containing block is grid and weird abspos edge is due to justify-content, not alignment." /> 8 9 <style> 10 div { 11 height: 100px; 12 width: 100px; 13 } 14 </style> 15 16 <p>Test passes if there is a filled green square and <strong>no red</strong>.</p> 17 18 <div style="display: grid; position: relative;"> 19 <div style="display: flex; justify-content: flex-end; background: red"> 20 <div style="position: absolute; background: green"> 21 </div> 22 </div>