Place 3 tables top left side, 2nd one below it (left side) and 3rd one on the top right

Question

How do I place 3 tables L1, L2, R1 in the specified below position:

1. L1 on Top Left
2. L2 below L1 on the Left
3. R1 on the Top Right

table.one {
float:left;
width:45%;
}

table.two   {
width:45%;
float:right;
}

https://jsfiddle.net/Lvsu0vdz/

Answer 1

No bootstrap required. Here you go.

 .inlineTable {
   display: inline-block;
 }
 table.one {
   width: 45%;
   display: inline-block;
 }
 table.two {
   width: 45% float: left;
 }

<div class="inline table">
  <table class="one">
    <tr>
      <th>Month-1</th>
      <th>Savings-1</th>
    </tr>
    <tr>
      <td>January</td>
      <td>$100</td>
    </tr>
  </table>

  <table class="one">
    <tr>
      <th>Month-2</th>
      <th>Savings-2</th>
    </tr>
    <tr>
      <td>January</td>
      <td>$100</td>
    </tr>
  </table>
</div>

<table class="two">
  <tr>
    <th>Month-3</th>
    <th>Savings-3</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>