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 回答