CSS和DIV 3列带有“ TILES”

table {
  float: left;
  margin-right: 0.2em;
}
table.left tr td {
  background-color: red;
}

table.middle tr td {
  background-color: blue;
}

table.right tr td {
  background-color: green;
}

<table class="left">
<tr>
  <td style="height:10em">
	<div>Left 1</div>
  </td>
</tr>
<tr>
  <td>
	<div style="height:2em">Left 2</div>
  </td>
</tr>
<tr>
  <td>
	<div style="height:3em"> Left 3</div>
  </td>
</tr>
</table>

<table class="middle">
<tr>
  <td>
	<div style="height:1em">Middle 1</div>
  </td>
</tr>
<tr>
  <td>
	<div style="height:4em">Middle 2</div>
  </td>
  </tr>
  <tr>
    <td>
	  <div style="height:7em">Middle 3</div>
	 </td>
  </tr>
</table>

<table class="right">
  <tr>
	<td>
	  <div style="height:5em">Right 1</div>
	</td>
	</tr>
  <tr>
	<td>
	  <div style="height:5em">Right 2</div>
	 </td>
  </tr>
  <tr>
    <td>
		<div style="height:8em">Right 3</div>
	</td>
  </tr>
</table>