contain-style-breaks-004.html (1223B)
1 <!doctype html> 2 <html lang=en> 3 <meta charset=utf-8> 4 <title>CSS-contain test: style containment and break-before</title> 5 <link rel="author" title="Florian Rivoal" href="https://florian.rivoal.net"> 6 <meta name=flags content=""> 7 <meta name=assert content="style containment is not (any longer) supposed to have any effect on the break-before property."> 8 <link rel="match" href="reference/contain-style-breaks-004-ref.html"> 9 <link rel=help href="https://drafts.csswg.org/css-contain-1/#containment-style"> 10 11 <style> 12 article { 13 columns: 2 1ch; 14 column-gap: 0; 15 float: left; 16 font-family: monospace; 17 margin-right: 3em; 18 line-height: 1; 19 height: 4em; 20 column-fill: auto; 21 } 22 div > div:last-of-type { 23 break-before: column; 24 } 25 #test > div { 26 contain: style; 27 } 28 </style> 29 30 <p>Test passes if there are two identical blocks “A” letters below. 31 <article id=ref> 32 <div> 33 <div>A<br>A</div> 34 <div>A<br>A</div> 35 </div> 36 </article> 37 <article id=test> 38 <div> 39 <div>A<br>A</div> 40 <div>A<br>A</div> 41 </div> 42 </article> 43 <!-- 44 Having two blocks to avoid making browsers that don't support the property at all fail. 45 Since containment is supposed to have no effect, failing such browsers would not be useful. 46 -->