CODEWITHSUNDEEP
htmlcss
user1548361
user1548361

Reputation: 3

HTML Table Text Alignment

<table>
   <tr><td>aaaaa</td></tr>
   <tr><td>aaaaaaaaaa</td></tr>
   <tr><td>aaa</td></tr> 
</table>

I want the text of first row and third row to be right aligned but not the second line, how can I do that?

Upvotes: 0

Views: 351

Answers (3)

Filipa Lacerda
Filipa Lacerda

Reputation: 156

<table>
    <thead></thead>
    <tbody>
        <tr class='right'><td>aaa</td></tr>
        <tr><td>aaa</td></tr>
        <tr class='right'><td>aaa</td></tr>
    </tbody>
</table>

.rigth{
 text-align:rigth;
}

Upvotes: 0

Clyde Lobo
Clyde Lobo

Reputation: 9174

You can use the HTML that you have and use the nth-child selector

tr:nth-child(odd) {
text-align:right;
}

Upvotes: 2

user1537415
user1537415

Reputation:

Very simple.

 <table>
       <tr style="text-align:right;"><td>aaaaa</td></tr>
       <tr><td>aaaaaaaaaa</td></tr>
       <tr style="text-align:right;><td>aaa</td></tr> 
    </table>

Or use classes:

<table>
           <tr class="tr-right"><td>aaaaa</td></tr>
           <tr><td>aaaaaaaaaa</td></tr>
           <tr class="tr-right"><td>aaa</td></tr> 
        </table>

And add to css:

.tr-right{text-align:right;}

Or as mentioned, you could use the css3 selector, but this doesn't work in all browsers.

tr:nth-child(odd) {
text-align:right;
}

Upvotes: 1

Related Questions