1

ネストされたテーブルがいくつかあります。メインの外側のテーブルがあり、左右の列にテーブルをネストする必要があり、各列にはいくつかのテーブルが互いに積み重なっています。私が理解できないように見えるのは、列内のテーブルをすべて同じ幅にする方法です（ほとんどが右側の列にあります）。読みやすいように縮小した HTML を次に示します。

<table class="outer">
        <tr>
            <td>
                <table class="column" id="left_column">
                    <tr>
                        <td>
                            <table class="cell" id="t1">
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <table class="cell" id="t2" style="margin-top:20px; margin-left:86px">
                            </table>
                        </td>
                    </tr>
                </table>
            </td>
            <td>
                <table class="column" id="rightColumn">
                    <tr>
                        <td>
                            <table class="cell" id="t3">
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <table class="cell" id="t4">
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <table class="cell" id="t5">
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <table class="cell" id="t6">
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <table class="cell" id="t7">
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <table class="cell" id="t8">
                            </table>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            <table class="messages" id="t9">
                            </table>
                        </td>
                    </tr>
                </table>
            </td>
        </tr>
    </table>

そして、関連する CSS は次のとおりです。

.outer
{
margin: auto;
}
.column
{
border: none;
margin-left: auto;
margin-right: auto;
}
table.cell
{
border-collapse: collapse;
}
#rightColumn table
{
padding: 10px;
width: 100%;
}

アドバイスをいただければ幸いです。

4

2 に答える 2

0

したがって、私が持っていたCSSは有効でした。Firefox は実際には、このページの古い CSS をキャッシュしていました。キャッシュをクリアするとすぐに幅が 100% になりました。

于 2012-07-12T18:37:04.043 に答える
0

表の列の幅を本当に決めたい場合は、 のtable-layout: fixedCSS プロパティを使用tableして、最初の行のすべてのセルの幅を指定します (または、最初の行colがない場合は要素を使用します)。

于 2012-07-12T16:46:07.753 に答える