如何使用CSS将整个表格对齐？

Question

如何使用CSS将整个表格对齐？

margin-right 没有帮助

这里:http://jsfiddle.net/dimskraft/Y2FKy/

HTML:

<table class="block logo">
    <colgroup>
        <col style="width:50%"/>
        <col style="width:50%"/>
    </colgroup>
    <tr>
        <td>something</td>
        <td>
            <table class="menu">
                <tr>
                    <td>Item 1</td>
                    <td>Item 2</td>
                </tr>
            </table>
        </td>
    </tr>
</table>

CSS:

table {
    width: 100%;
}
table.menu {
    width: auto;
    margin-right: 0px;
}

Answer 1

您还需要设置左边距auto.这将使左边距按右边距允许的方式向右移动.

table {
    width: 100%;
}
table, td {
    border: solid black 1px;
}
table.menu {
    width: auto;
    margin-right: 0px;
    margin-left: auto;
}

<table class="block logo">
    <colgroup>
        <col style="width:50%"/>
        <col style="width:50%"/>
    </colgroup>
    <tr>
        <td>something</td>
        <td>
            <table class="menu">
                <tr>
                    <td>Item 1</td>
                    <td>Item 2</td>
                </tr>
            </table>
        </td>
    </tr>
</table>

Answer 2

简单的 -

table {
    width: 60%; /* Whichever width you want */
    margin-left: 40%; /* Minus the amount to make it 100% */
}