如何在TD内对齐表格？

Question

我有2的表 <tr>和2 <td> ：

<table>
    <tr>
        <td>
            <table>
                <!-- other content -->
            </table>
        </td>
        <td/>
    </tr>
    <tr>
        <td/><td/>
    </tr>
</table>

在*****的地方我需要插入几乎相同的表（ 不包含另一个表）。 但是当我调试它时，表格保持对齐。

实例

我希望左上方框中的表格是右对齐的 （知识：和中心对齐 ）。

例如：其中的表是32px宽度，但包含td是64px宽度。

如何将桌子对齐？

Answer 1

table是块元素 ; text-align和align仅适用于内联元素 。 所以对于块元素，你必须使用margin ：

CSS：

.centered{
    margin: 0 auto;
}

.rightaligned{
    margin-right: 0;
    margin-left: auto;
}

.leftaligned{
    margin-left: 0;
    margin-right: auto;
}

HTML：

<td>
    <table class="leftaligned">
        <!-- Other Content -->
    </table>
    <table class="centered">
        <!-- Other Content -->
    </table>
    <table class="rightaligned">
        <!-- Other Content -->
    </table>
</td>

这几乎适用于所有浏览器，甚至是Internet Explorer 7 。

Answer 2

只考虑以下因素：

<table>
    <tr>
        <td style="text-align: right"></td>
        <td/>
    </tr>
    <tr>
        <td/><td/>
    </tr>
</table>

或者另一种css方法：

table table {
    float: right;
}

或嵌入浮动：

<table>
    <tr>
        <td>
            <table style="float: right;">.....</table>
        </td>
        <td/>
    </tr>
    <tr>
        <td/><td/>
    </tr>
</table>

Answer 3

如果td只包含表而没有其他文本或元素，那么代码下面也应该有效，只有它才能正确对齐td所有内容并且不能在html5中工作：

<table>
    <tr>
        <td align="right">*</td>
        <td/>
    </tr>
    <tr>
        <td/><td/>
    </tr>
</table>