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>

然后将文本对齐中心。