以表格布局为中心的表格

Question

fiddle - 在这里你有2张同样风格的桌子。 TD的宽度由table-layout.自动调整。当只有一行文字时，它可以正常工作。但是当有更多的文本和文本被扭曲时，似乎宽度是由所有文本计算的（就像它在一行中一样），而不是由文本中最长的扭曲部分计算。

问题是如何以与在1＆st; st表中完成相同的方式将表nr 2的内容居中？ （atm它看起来不像中心...）

- 它应该看起来如何（较低的一个） - 不需要黄色空间应该被切割以允许表格居中。

Answer 1

td { text-align:center }

第一个表格中的文字实际上并未居中。它看起来就是这样，因为它在电池的两侧都没有呼吸空间。

如上所述制作全局声明将允许对剩余单元格进行额外调整。

td.first { text-align:left; font-weight:700 }等

修改

如果没有声明宽度，你将无法实现这种效果。默认情况下，表格不像div那样，所以我给它display:block, width:80%，现在表格中心，td没有正确填充其父级，所以我给了它{{ 1}}。

我认为这就是你所追求的：http://jsfiddle.net/hJXb9/

Answer 2

我认为你正在寻找这个。

    <table style="width:60%;margin-left:20%;margin-right:20%;">
    <tr>
        <td style="background:green;text-align: center; vertical-align: middle;">
            TADA
        </td>
        <td style="background:yellow;text-align:center; vertical-align: middle;">
            Lorem ipsum dolorsitamet kjfldslggfh;l</td>
        </tr>
    </table>

Live Demo

希望，我会帮助你。谢谢。 !!