18

私は2と2のテーブルを持っています:<tr><td>

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

*****の場合、ほぼ同じテーブル(別のテーブルを含まない)を挿入する必要があります。しかし、デバッグすると、テーブルは左揃えになります。

実例

左上のボックスのテーブルを右揃えにします(知識のために:および中央揃え)。

例:内のテーブルは32ピクセル幅ですが、含まれているテーブルtdは64ピクセル幅です。

テーブルを右に揃えるにはどうすればよいですか?

4

3 に答える 3

27

Atableブロック要素です; インライン要素text-alignalignのみ機能します。したがって、ブロック要素の場合は、次を使用する必要があります。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を含め、ほとんどすべてのブラウザで機能します。

于 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 に答える