CSS 嵌套table 居中问题_html/css_WEB-ITnose

按常理来说，只要在父table的tr 或td里设置text-align:center就能居中了。可是VS设计器里居中了，浏览器居中不了。ff里不居中还可以理解，连IE也不能就费解了。

<tr style="text-align:center">                <td>                    <table style="border-collapse:collapse">                        <tr style="text-align:center;">                            <td style="border:solid #000 1px">单位工程数量</td>                            <td style="border:solid #000 1px">总建筑面积</td>                            <td style="border:solid #000 1px">单价（元/平）</td>                            <td style="border:solid #000 1px">小计</td>                        </tr>                        <tr>                            <td style="border:solid #000 1px"><input id="txt_UnitNum" type="text" class="txtInTab" runat="server" style="text-align:center; background-color: #e6eae9;"/></td>                            <td style="border:solid #000 1px"><input id="txt_AreaNum" type="text" class="txtInTab"  runat="server" style="text-align:center; background-color: #e6eae9;"/></td>                            <td style="border:solid #000 1px"><input id="txt_UnitPrice" type="text" class="txtInTab" runat="server" style="text-align:center; background-color: #e6eae9"/></td>                            <td style="border:solid #000 1px"><input id="txt_Total" type="text" class="txtInTab" readonly="readonly" runat="server" style="text-align:center; background-color: #e6eae9"/></td>                        </tr>                        <tr>                            <td style="text-align:center;border:solid #000 1px">合计</td>                            <td colspan='2' style="border:solid #000 1px;">大写：<input id="txt_Cap" type="text" class="txtInTab" readonly="readonly" runat="server" style="width: 255px; background-color: #e6eae9" /></td>                            <td style="border:solid #000 1px"><input id="Text9" type="text" class="txtInTab" readonly="readonly" runat="server" style="background-color: #e6eae9"/></td>                        </tr>                    </table>                </td>            </tr>

如果有人说是父元素继承的话，那我父元素里没写什么东西
外层table里就多了一句

style="margin-left:auto; margin-right:auto"

body就更谈不上了。只设置了背景和前景色

    body     {        font: normal 9pt auto "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;        color: #4f6b72;        background: #E6EAE9;        margin:0 auto;    }

但里面的table就是居中不了，麻烦帮我分析下~谢谢

回复讨论(解决方案)

在线求解！哪怕是一点点建议也行啊~

饿别在tr里面加center

加在 td里面  style="text-align:center"

加在 td里面  style="text-align:center" 效果一样。早试过了

最外层在个div

这样就居中了

<tr style="text-align:center">                <td>                    <table style="text-align:center;border-collapse:collapse">                        <tr style="text-align:center;">                            <td style="border:solid #000 1px">单位工程数量</td>                            <td style="border:solid #000 1px">总建筑面积</td>                            <td style="border:solid #000 1px">单价（元/平）</td>                            <td style="border:solid #000 1px">小计</td>                        </tr>                        <tr>                            <td style="border:solid #000 1px"><input id="txt_UnitNum" type="text" class="txtInTab" runat="server" style="text-align:center; background-color: #e6eae9;"/></td>                            <td style="border:solid #000 1px"><input id="txt_AreaNum" type="text" class="txtInTab"  runat="server" style="text-align:center; background-color: #e6eae9;"/></td>                            <td style="border:solid #000 1px"><input id="txt_UnitPrice" type="text" class="txtInTab" runat="server" style="text-align:center; background-color: #e6eae9"/></td>                            <td style="border:solid #000 1px"><input id="txt_Total" type="text" class="txtInTab" readonly="readonly" runat="server" style="text-align:center; background-color: #e6eae9"/></td>                        </tr>                        <tr>                            <td style="text-align:center;border:solid #000 1px">合计</td>                            <td colspan='2' style="border:solid #000 1px;">大写：<input id="txt_Cap" type="text" class="txtInTab" readonly="readonly" runat="server" style="width: 255px; background-color: #e6eae9" /></td>                            <td style="border:solid #000 1px"><input id="Text9" type="text" class="txtInTab" readonly="readonly" runat="server" style="background-color: #e6eae9"/></td>                        </tr>                    </table>                </td>            </tr>

在子table里面加上样式text-align:center就行了

按常理来说……
不能按常理啊

  

试一下

    
  

  
    
  

        
          
          
          
          
        
        
          
          
          
          
        
        
          
          
          
        
      

单位工程数量	总建筑面积	单价（元/平）	小计
合计	大写：

和

不一样，不信你可以试试

   

        

给里面的table加上display:inline-table;就可以了。
之前不能居中应该是因为text-align不能作用于block level的元素，所以对table不起作用。 

   

        

给里面的table加上display:inline-table;就可以了。
之前不能居中应该是因为text-align不能作用于block …… OK,好了，谢谢