JSFiddle - React, Tailwind, and code Playground

HTML

<h1>Etiam porta sem malesuada magna mollis euismod.</h1>

<table class="first_table">
  <tr>
    <td>Cursus Nullam</td>
    <td>Cursus Nullam</td>
  </tr>
  <tr>
    <td>Cursus NullamCursus NullamCursus NullamCursus NullamCursus Nullam</td>
    <td>Cursus NullamCursus NullamCursus NullamCursus Nullam</td>
  </tr>
</table>

<img src="http://placekitten.com.s3.amazonaws.com/homepage-samples/408/287.jpg" alt="" />

<div class="clear"></div>

<table class="second_table">
  <tr>
    <td>Cursus Nullam</td>
    <td>Cursus Nullam</td>
  </tr>
  <tr>
    <td>Cursus NullamCursus NullamCursus NullamCursus NullamCursus Nullam</td>
    <td>Cursus NullamCursus NullamCursus NullamCursus Nullam</td>
  </tr>
</table>

CSS

table.first_table {
    float: left;
    width: 50%;
    height: 200px;
    border: 1px solid #000;
    border-bottom: none;
}

.clear {
    clear: both;
}

img {
    float: left;
    width: 48%;
    margin-left: 2%;
    height: 190px;
}

table.second_table {
    width: 100%;
    border: 1px solid #000;
}