4

I have a Table with 2 columns.I would like to be able to justify text in each cell so i used text-align:justify; for each <td> tag,but it does not seem to work?

enter image description here

Html Code:

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

Css Code:

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;
}

Result: http://jsfiddle.net/d5VTg/22/

How can I justify this line of text? ​ ​

Brian Tompsett - 汤莱恩
  • 5,753
  • 72
  • 57
  • 129
KF2
  • 9,887
  • 8
  • 44
  • 77
  • Do you need that cell to be filled with text?? without space?? coz now your text is justified only – Sowmya Nov 19 '12 at 06:26
  • @Sowmya Shivaram:Yes I need each cells fill with text and with space between words. – KF2 Nov 19 '12 at 06:31

1 Answers1

0

You have fixed the width of the each cell so that you are able see the extra white space. Otherwise your text is justified.

In this case change the width properties like this 

width:auto;
max-width:230px;

Now the cell max width will be 230px

DEMO HERE

Sowmya
  • 26,684
  • 21
  • 96
  • 136
  • this answer does not appear to work .. maybe "not anymore" .. see the ::after trick with width:100% to achieve the desired effect: https://stackoverflow.com/a/21199162/3022387 – flowtron Nov 08 '19 at 14:08