24

非常に単純な問題があります。TD要素内のテーブルを中央に配置する必要があります。HTML 4を使用している場合は、次のようにします。

​<table style="border:solid;width: 100%">
    <tr>
        <td align="center">
            <table style="border:solid; width:50%">
                <tr>
                    <td >I must be in the center</td>                    
                </tr>
            </table> 
        </td>                    
    </tr>
</table>​

しかし、私は非推奨の属性を使用せず、CSSの方法でそれを実行しようとしています。私はすでにこれを試しました：

<td style="text-align:center">

この：

<td style="margin: 0 auto">

そして、テーブルはセルの左側にあります。助言がありますか？

4

3 に答える 3

34

margin:auto 0;あなたは0を外すだけで正しい考えを持っていました。

実例： http： //jsfiddle.net/cxnR8/

<table style="border:solid;width: 100%">
    <tr>
        <td>
            <table style="margin:auto;border:solid; width:50%">
                <tr>
                    <td >I must be in the center</td>                    
                </tr>
            </table> 
        </td>                    
    </tr>
</table>​

しかし、もっと重要なのは、本当にテーブルとインラインスタイルを使用する必要があるのでしょうか。

于 2012-12-28T21:20:27.417 に答える
1

あなたの2番目の提案は正しいです。この作業例を参照してください。

HTML：

<table class="outer">
    <tr>
        <td>
            <table class="inner">
                <tr>
                    <td>in the middle</td>                    
                </tr>
            </table> 
        </td>                    
    </tr>
</table>​

CSS：

.outer
{
    width: 100%;
    border: solid 1px red;
}
.inner
{
    width: 25%;
    margin: auto;
    border: solid 1px blue;
}
​
于 2012-12-28T21:25:14.910 に答える
1

非推奨のalign=""属性を使用してテーブルを中央揃えにします。

<table>
    <tr>
        <td>
            <table align="center">
                <tr>
                    <td>in the middle</td>                    
                </tr>
            </table> 
        </td>                    
    </tr>
</table>​
于 2017-03-06T20:55:12.043 に答える