将 3 张桌子放在左上角，第 2 张在其下方（左侧），第 3 张放在右上角

Question

如何将 3 个表 L1、L2、R1 放置在以下指定位置：

左上角 L1
左侧 L1 下方的 L2
右上角的R1

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

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

https://jsfiddle.net/Lvsu0vdz/

Answer 1

不需要 bootstrap。给你。

 .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>0</td>
    </tr>
  </table>

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

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

将 3 张桌子放在左上角，第 2 张在其下方（左侧），第 3 张放在右上角

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

html

css

vertical-alignment

css-tables