min-max-size-table-content-box-ref.html (1013B)
1 <!doctype html> 2 <title>CSS Test Reference</title> 3 <meta charset="utf-8"> 4 <style> 5 html, 6 body { 7 color: black; 8 background-color: white; 9 font: 16px/0 monospace; 10 padding: 0; 11 margin: 0; 12 } 13 14 .table { 15 box-sizing: content-box; 16 border: 3px solid black; 17 padding: 5px; 18 background: blue content-box; 19 display: inline-block; 20 } 21 22 .big { 23 width: 75px; 24 height: 75px; 25 } 26 27 .td { 28 padding: 1px; 29 } 30 31 .grid { 32 display: grid; 33 width: 75px; 34 height: 75px; 35 } 36 </style> 37 <div class="table"><div class="td"></div></div><br> 38 <div class="table" style="min-height: 50px"><div class="td"></div></div><br> 39 <div class="table" style="min-width: 50px"><div class="td"></div></div><br> 40 <div class="table"><div class="td"><div class="big"></div></div></div><br> 41 <div class="table"><div class="td"><div class="big"></div></div></div><br> 42 <div class="grid"><div class="table" style="max-height: 50px"><div class="td"></div></div></div> 43 <div class="grid"><div class="table" style="max-width: 50px"><div class="td"></div></div></div>