html - 表格的正确对齐方式和大小

Question

从我的两张桌子可以看出，一张的尺寸与另一张不同。我的第一个问题是，为什么会这样？当我<th>将顶部表格中的宽度设置为 100/300/100/100/100 (=700) 和底部表格中的 500/100/100 (=700)

2. 我想将下表中的第一列设置为不可见，因为我只想查看底部表的摘要和总计。我也想与上表的右侧对齐。任何想法或建议将不胜感激。是否与在样式中设置边框有关？

例如，如果我尝试使用左边框，我可以添加边框宽度、边框样式、边框颜色、继承？

（表 2）

 <table class="detailstable StartOnNewPage" align="center">
        <tr>          

                <th style="width:500px;"></th>  
                <th style="text-align:left; width:100px;">Summary</th>   
                <th style="text-align:right; width:100px;"></th>        
        </tr>
        <tr>                  
                <td style="width:500px;"></td>
                <td style="text-align:left; width:100px;">Labour</td>
                <th style="text-align:right; width:100px;"><%: this.FormatMoney(LabourTotal)%></th>
        </tr>
        <tr>              
                <td style="width:500px;"></td>
                <td style="text-align:left; width:100px; border-top:yes;">Plant</td>
                <th style="text-align:right; width:100px;"><%: this.FormatMoney(PlantTotal)%></th>                   
        </tr>
        <tr>
                <td style="width:500px;"></td>                     
                <th style="text-align:right; width:100px;"><%: this.DisplayPlantPercentage%></th>    
                <td style="text-align:right; width:100px;"><%: this.PlantToDisplayWithTwoDecimalPlaces%></td> 
        </tr>
         <tr>                 
                <td style="width:500px;"></td>
                <td style="text-align:left; width:100px;">Miscellaneous</td> 
                <th style="text-align:right; width:100px" class="FadeOutOnEdit"><%: this.FormatMoney(MiscellaneousItemsTotal) %></th>                 
         </tr>
         <tr>
                <td style="width:500px;"></td>                     
                <th style="text-align:right; width:100px;"><%: this.DisplayMiscellaneousPercentage%></th>    
                <td style="text-align:right; width:100px;"><%: this.MiscellaneousToDisplayWithTwoDecimalPlaces%></td> 
         </tr>
         <tr>   
                <td style="width:500px;"></td>
                <th style="text-align:left; width:100px;">TOTAL</th> 
                <th style="text-align:right; width:100px;"><%: this.FormatMoney(TotalOfAll)%></th>                 
        </tr>
        </table>

现在看起来像：

Answer 1

对于下部表格，删除第一列并使用表格属性对齐，如下所示

<table class="detailstable StartOnNewPage" align="right">
    <tr>          
    <th style="text-align:left; width:100px;">Summary</th>   
            <th style="text-align:right; width:100px;"></th>        
    </tr>
    <tr>                  
            <td style="text-align:left; width:100px;">Labour</td>
            <th style="text-align:right; width:100px;"><%: this.FormatMoney(LabourTotal)%></th>
    </tr>

……