如何正确地将表格置于其div容器的中心？

Question

我不太喜欢HTML和CSS，但在将表格放在其容器中心时遇到了一些问题。 所以我有以下情况：

<!-- SEDE LEGALE: -->
<div id="sedeLegaleTab">
    <table class="standard-table-cls table-header-cls">
        <thead class="opening active">
            <tr>
                <th>
                    <img class="imgAccordion" src="img/arrow_down.gif"/>
                    Sede Legale
                </th>
             </tr>
        </thead>

        <tbody class="expanded" >
            <tr>
                <td>
                    <div id="sedeLegaleContent" class="accordion-pane-content">
                        <table class="standard-table-cls" style="width: 90%;">
                            <tbody>
                                <tr>
                                    <td>Ragione Sociale</td>
                                    <td colspan=5>
                                        <input type="TEXT" name="ragsoc" size=60 maxlength=100 <%=master?"":"readonly"%>
                                               class="testosmallUpper" value="<%= ragioneSociale %>" onblur="MakeItUpper(event,this)">
                                    </td>
                                </tr>

                                ..............................................
                                ..............................................
                                ..............................................
                                OTHER TR
                                ..............................................
                                ..............................................
                                ..............................................
                            </tbody>
                        </table>
                     </div>
                </td> 
            </tr>
        </tbody>
    </table>
</div>

我知道这是一个非常糟糕的旧表布局，但是它是一个非常旧的遗留应用程序，因此我必须对其进行处理。

因此，这是此表的内容（即上一代码中）呈现的屏幕快照：

<table class="standard-table-cls" style="width: 90%;">

现在，您可以看到，该表已放入具有id =“ sedeLegaleContent”的div中，并且已将样式设置为style =“ width：90％;”。

因此，我需要将其居中放置在其容器中（div具有id =“ sedeLegaleContent” ）

我该怎么做？

我可以通过以下方式向其添加align =“ center”属性：

<div id="sedeLegaleContent" class="accordion-pane-content" align="center">

但是我可以使用CSS以更好的方式做到这一点吗？ 还是一个好的解决方案？

Answer 1

尝试像这样使用： 演示

CSS：

table{
    border:1px solid #ddd;
    margin:0 auto;
}