| <!DOCTYPE html> |
| <style> |
| table { border-spacing: 0; } |
| thead, tfoot { break-inside: avoid; } |
| td { height: 18px; padding: 0; font-size: 14px; } |
| </style> |
| <div style="columns: 2; width: 300px; height: 200px; column-fill: auto"> |
| <div style="height: 100px; background: grey"></div> |
| <div style="columns: 2; column-fill: auto; height: 300px"> |
| <table> |
| <thead><td>HEAD</td></thead> |
| <tr><td>1</td></tr> |
| <tr><td>2</td></tr> |
| <tr><td>3</td></tr> |
| <tr><td>4</td></tr> |
| <tr><td>5</td></tr> |
| <tr><td>6</td></tr> |
| <tr><td>7</td></tr> |
| <tr><td>8</td></tr> |
| <tr><td>9</td></tr> |
| <tr><td>10</td></tr> |
| <tr><td>11</td></tr> |
| <tr><td>12</td></tr> |
| <tr><td>13</td></tr> |
| <tr><td>14</td></tr> |
| <tr><td>15</td></tr> |
| <tr><td>16</td></tr> |
| <tr><td>17</td></tr> |
| <tr><td>18</td></tr> |
| <tfoot><td>FOOT</td></tfoot> |
| </table> |
| </div> |
| </div> |