在表格单元格中对齐文本

时间:2012-11-19 05:08:42

标签: html css html-table text-align

我有一个包含2列的表。我希望能够在每个单元格中对齐文本,因此我对每个text-align:justify;标记使用<td>,但它似乎不起作用?

enter image description here

Html代码:

<table >
<tr >
<td  class=tblcellA>سرآغاز گفتار نام خداست </td>
<td  class=tblcellB>كه رحمتگر و مهربان خلق راست</td>   
</tr>
<tr >
<td  class=tblcellA>ستايش بود ويژه كردگار</td>
<td  class=tblcellB>كه بر عالمين است پروردگار</td>   
</tr>
</table>

Css代码:

body
{
   overflow:hidden;
   font-family:tahoma;
   FONT-SIZE:15px;
direction:rtl;
}
.tblcellA
{
    BORDER-RIGHT: #7e975b 1px solid;
    BORDER-TOP: #7e975b 1px solid;
    BORDER-LEFT: #7e975b 1px solid;
    BORDER-BOTTOM: #7e975b 1px solid;

   text-align:justify;
   padding-right:18px;
    width:230px;

}
.tblcellB
{
    BORDER-RIGHT: #7e975b 1px solid;
    BORDER-TOP: #7e975b 1px solid;
    BORDER-LEFT: #7e975b 1px solid;
    BORDER-BOTTOM: #7e975b 1px solid;

   width:230px;
   text-align:justify;
   padding-right:18px;
}

结果: http://jsfiddle.net/d5VTg/22/

我如何证明这一行文字的合理性?

1 个答案:

答案 0 :(得分:1)

您已修复每个单元格的宽度,以便能够看到额外的空白区域。否则你的文字是合理的。

在这种情况下,像这样更改宽度属性

width:auto;
max-width:230px;

现在单元格最大宽度为230px

DEMO HERE