860242-1-ref.html (1023B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <style> 6 .table { 7 display: table; 8 width: 100px; 9 table-layout: fixed; 10 margin-bottom: 2px; 11 } 12 13 .table > * { 14 box-sizing: border-box; 15 display: table-cell; 16 height: 30px; 17 } 18 19 .withBorder { border: 2px solid black; } 20 21 .thin { width: 25px; } 22 .wide { width: 75px; } 23 24 .teal { background: teal; } 25 .purple { background: purple; } 26 </style> 27 </head> 28 <body> 29 <div class="table"> 30 <div class="thin teal"></div> 31 <div class="wide purple"></div> 32 </div> 33 <div class="table"> 34 <div class="thin teal"></div> 35 <div class="wide purple"></div> 36 </div> 37 <div class="table"> 38 <div class="thin withBorder teal"></div> 39 <div class="wide withBorder purple"></div> 40 </div> 41 <div class="table"> 42 <div class="thin withBorder teal"></div> 43 <div class="wide withBorder purple"></div> 44 </div> 45 </body> 46 </html>