block-max-height-001b.html (1176B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>CSS Test: max-height block fragmentation</title> 5 <link rel="author" title="Mats Palmgren" href="mailto:mats@mozilla.com"> 6 <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1602430"> 7 <link rel="help" href="https://drafts.csswg.org/css-break"> 8 <link rel="match" href="block-max-height-001b-ref.html"> 9 <style> 10 html,body { 11 color:black; background-color:white; font:24px/1 monospace; padding:0; margin:0; 12 width: 300px; 13 } 14 .columns { 15 columns: 3; 16 background: grey; 17 margin-bottom: 1em; 18 } 19 .columns > div { 20 max-height: 128px; 21 background: yellow; 22 border: solid; 23 border-width:10px 0 6px 0; 24 padding: 5px 0 3px 0; 25 } 26 .columns > div > div { height:200px; width:50px; border:solid; } 27 </style> 28 </head> 29 <body> 30 <div class="columns"> 31 BEFORE 32 <div> 33 <div></div> 34 </div> 35 AFTER 36 </div> 37 <div class="columns" style="height:100px"> 38 BEFORE 39 <div> 40 <div></div> 41 </div> 42 AFTER 43 </div> 44 <div class="columns" style="height:70px"> 45 BEFORE 46 <div> 47 <div></div> 48 </div> 49 AFTER 50 </div> 51 <div class="columns" style="height:50px"> 52 BEFORE 53 <div> 54 <div></div> 55 </div> 56 AFTER 57 </div> 58 </body> 59 </html>