表格中的中心底行单元格

时间:2015-02-17 17:35:15

标签: html css html-table alignment

是的,这是基于表格的布局。它的遗产让我可能会或者可能无法破解表格,但是我想了解表格对齐是如何工作的无论如何,因此这可以说是令人讨厌的问题。

假设我有一个3x3表,其值为1,2,3,...,8。结束于8,因此最后一行只有2个元素。我希望那些中心。

HTML:

<table>
    <tr><td>1</td><td>2</td><td>3</td></tr>
    <tr><td>4</td><td>5</td><td>6</td></tr>
    <tr><td>7</td><td>8</td></tr>
</table>

我希望CSS规则tr { text-align: center }能够正常工作,但我认为有某种表结构规则可以胜过文本对齐在这种情况下会做什么,所以我可能需要其他一些样式属性取消。

小提琴,包括一堆不能做我想做的CSS:http://jsfiddle.net/sdqtg7kr/

1 个答案:

答案 0 :(得分:4)

如果您希望这些底部td元素尊重text-align: center,则可以将元素的displaytable-cell更改为inline-block

Updated Example

td {
    border-color: red;
    border-style: solid;
    border-width: thin;
    display: inline-block;
}