shape-outside-formatting-context.tentative.html (791B)
1 <!DOCTYPE html> 2 <link rel="match" href="reference/shape-outside-formatting-context-ref.html"> 3 <link rel="help" href="https://drafts.csswg.org/css-shapes/"> 4 <link rel="help" href="https://github.com/w3c/csswg-drafts/issues/1970"> 5 <meta name="assert" content="The test verifies that a new formatting context does *not* get sized and positioned based off the float area (defined by shape outside)."> 6 <style> 7 .test { 8 width: 200px; 9 overflow: hidden; 10 } 11 12 .float { 13 float: left; 14 width: 50%; 15 height: 100px; 16 17 background: orange; 18 shape-outside: polygon(0 0, 100% 100%, 0 100%); 19 clip-path: polygon(0 0, 100% 100%, 0 100%); 20 } 21 22 .flex { 23 display: flex; 24 height: 50px; 25 background: rebeccapurple; 26 } 27 </style> 28 <div class="test"> 29 <div class="float"></div> 30 <div class="flex"></div> 31 </div>