flexbox-table-flex-items-5-ref.html (854B)
1 <!DOCTYPE html> 2 <!-- 3 Any copyright is dedicated to the Public Domain. 4 http://creativecommons.org/publicdomain/zero/1.0/ 5 --> 6 <html> 7 <head> 8 <meta charset="utf-8"> 9 <title> 10 CSS Reference Case 11 </title> 12 <style> 13 .container { 14 display: flex; 15 width: 300px; 16 border: 1px solid black; 17 margin-bottom: 5px; 18 } 19 .container > * { 20 margin: 5px; 21 background: lightgray; 22 flex: 1 400px; /* Bigger than flex container; should cooperatively shrink to fit. */ 23 height: 30px; 24 } 25 </style> 26 </head> 27 <body> 28 <div class="container"> 29 <div> 30 <table><td></td></table> 31 </div> 32 <div> 33 <table><td></td></table> 34 </div> 35 </div> 36 <div class="container"> 37 <div> 38 <table><td></td></table> 39 </div> 40 <div> 41 <table><td></td></table> 42 </div> 43 </div> 44 </body> 45 </html>