flexbox_table-fixed-layout.html (787B)
1 <!DOCTYPE html> 2 <title>flexbox | flexcontainers in tables</title> 3 <link rel="author" href="http://opera.com" title="Opera Software"> 4 <link rel="help" href="http://www.w3.org/TR/css-flexbox-1/#flex-items"> 5 <link rel="match" href="../reference/blank.html"> 6 <style> 7 table { 8 width: 0; 9 table-layout: fixed; 10 border-spacing: 0; 11 } 12 td { 13 background: #3366cc; 14 padding: 0; 15 overflow: hidden; 16 } 17 div { 18 background: white; 19 width: 300px; 20 21 display: flex; 22 flex-wrap: wrap; 23 } 24 p { 25 xcolor: white; 26 background: yellow; 27 margin: 1em; 28 width: 200px; 29 } 30 </style> 31 32 <table> 33 <tr> 34 <td> 35 <div> 36 <p>filler</p> 37 <p>filler</p> 38 <p>filler</p> 39 <p>filler</p> 40 <p>filler</p> 41 </div> 42 </td> 43 <td> 44 <div> 45 <p>filler</p> 46 <p>filler</p> 47 <p>filler</p> 48 <p>filler</p> 49 <p>filler</p> 50 </div> 51 </td> 52 </tr> 53 </table>