HTML中心對齊Div中的表格與下面的按鈕列表

我想在中間的頂部中心對齊多個表格。在這些表格下面，我想要列出左對齊的垂直按鈕。我嘗試過許多不同的技術，但其中沒有一種似乎可行。請有人可以幫忙嗎？HTML中心對齊Div中的表格與下面的按鈕列表

當前小提琴例：

CSS

.TSS { 
    font-family: Verdana, Geneva, sans-serif; 
    font-size: 10.6px; 
    font-style: normal; 
    text-decoration: none; 
    float: left; 
    padding-top: 10px; 
    padding-right: 10px; 
    padding-bottom: 10px; 
    padding-left: 10px; 
    border: 1px solid black; 
} 

.button { 
    background-color: #4CAF50; 
    /* Green */ 
    border: none; 
    color: white; 
    padding: 5px 15px; 
    text-align: center; 
    text-decoration: none; 
    display: inline-block; 
    font-size: 16px; 
    margin: 4px 2px; 
    -webkit-transition-duration: 0.4s; 
    /* Safari */ 
    transition-duration: 0.4s; 
    cursor: pointer; 
} 

.button1 { 
    background-color: white; 
    color: black; 
    border: 2px solid #4CAF50; 
} 

.button1:hover { 
    background-color: #4CAF50; 
    color: white; 
}

HTML

<div id="lse" class="display"> 
    <table id="tblData" class="TSS"> 
    <tr> 
     <td align="center" colspan="4"><b>Table 1</b></td> 
    </tr> 
    </table> 

    <table id="tblData" class="TSS"> 
    <tr> 
     <td align="center" colspan="4"><b>Table 2</b></td> 
    </tr> 
    </table> 

    <input type="submit" class="button button1" name="submitButton" value="Button 1"> 
    <input type="submit" class="button button1" name="submitButton" value="Button 2"> 
    <input type="submit" class="button button1" name="submitButton" value="Button 3"> 
    <input type="submit" class="button button1" name="submitButton" value="Button 4"> 

</div>

來源

2016-04-22 Jaron787

可能只是在表格周圍創建一個包裝。

<div id="centertbl"> 
<table id="tblData" class="TSS"> 
    <tr> 
    <td align="center" colspan="4"><b>Table 1</b></td> 
    </tr> 
</table> 

<table id="tblData" class="TSS"> 
    <tr> 
    <td align="center" colspan="4"><b>Table 2</b></td> 
    </tr> 
</table>

然後將文本對齊中心。