HTML table column align right

Question

I have a table with 3 columns. I want that the third column is aligned to the right of the upper element and the other 2 columns to the left, like this:

(left column) (middle column)                                      (right column)

Is there a way to do this via CSS or something?

score 22 · Accepted Answer · edited Mar 31 '13 at 19:24

22

Use width:100% on the table and the middle column.

edited Mar 31 '13 at 19:24

Smi

13,850
9
56
64

answered Sep 08 '10 at 07:34

Vinay B R

8,089
2
30
45

You could also set width:100% on the last column's style and td align="right" on the last column. Then you can insert more columns in the middle while the spacing still works. – Adam Bruss Aug 08 '12 at 16:48

score 5 · Answer 2 · edited Mar 12 '23 at 18:57

5

There are a few ways to do what you want. The most basic is to change the alignment directly in the tag

<td align='left'>data1</td><td align='right'>data1</td><td align='left'>data1</td>
<td align='left'>data2</td><td align='right'>data2</td><td align='left'>data2</td>
....

If you need to change something else (CSS style) you could create a class like .firstColumn and .secondColumn on each <td>.

I tried to change directly the column, but that doesn't work (HTML table colgroup element is not working).

edited Mar 12 '23 at 18:57

Peter Mortensen

30,738
21
105
131

answered Sep 08 '10 at 07:45

pleasedontbelong

19,542
12
53
77

Is that still supported? – Peter Mortensen Mar 12 '23 at 18:58

score 5 · Answer 3 · answered May 13 '20 at 18:16

5

<td style="text-align:right;">data1</td>

answered May 13 '20 at 18:16

user2569050

423
6
5

HTML table column align right

3 Answers3