18

我有一张2和 2的桌子：<tr><td>

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

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

现场示例

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

例如：里面的表格是 32px 宽度，但包含td是 64px 宽度。

如何将表格向右对齐？

4

3 回答 3

27

A table is a block-element; text-align and align only works on inline-elements. So for a block-element you have to use 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>

This will work in almost every browser, even Internet Explorer 7.

于 2012-11-14T09:24:48.647 回答
3

只想到以下几点：

<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>
于 2012-11-13T15:14:48.313 回答
0

如果td仅包含表格并且没有其他文本或元素，那么下面的代码也应该可以工作，只有它会正确对齐所有内容td并且在 html5 中不起作用：

<table>
    <tr>
        <td align="right">*</td>
        <td/>
    </tr>
    <tr>
        <td/><td/>
    </tr>
</table>
于 2012-11-13T16:13:42.603 回答