contain-strict-003.html (1016B)
1 <!DOCTYPE html> 2 3 <meta charset="UTF-8"> 4 5 <title>CSS Containment Test: a block with 'contain: strict' alongside a float</title> 6 7 <link rel="author" title="Gérard Talbot" href="http://www.gtalbot.org/BrowserBugsSection/css21testsuite/"> 8 <link rel="help" href="https://www.w3.org/TR/css-contain-1/#contain-property"> 9 <link rel="match" href="reference/contain-layout-size-003-ref.html"> 10 11 12 <style> 13 div 14 { 15 color: transparent; 16 font-size: 16px; 17 padding: 8px; 18 } 19 20 div#floated-left 21 { 22 background-color: blue; 23 float: left; 24 margin: 8px; 25 width: 6em; 26 } 27 28 div#with-contain-strict 29 { 30 background-color: orange; 31 width: 12em; 32 33 contain: strict; 34 } 35 </style> 36 37 <p>Test passes if the orange rectangle and blue rectangle do not overlap. 38 39 <div id="floated-left">Some text in a blue rectangle.</div> 40 41 <div id="with-contain-strict">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore.</div>