Html table alignment rule

Question

-------------------------------- | item a item b | | item c item d item e | --------------------------------- | item a item b | | item c item d item e | 

I have two rows in the table, and I would like each of them to have a left-aligned element and some right-aligned elements, as in the first example above.

However, when I set item b , item d and item e to align="right" , I get the behavior of the second example above. Why is item b aligned with item d and not right ?

Edit : Jsfiddle

Answer 1

You had incorrect syntax. You used style="align-right" when I suppose you meant style="text-align:right;" . You also need to add colspan="2" to the <td> , which should span 2 columns - otherwise the cell is "element b":

 <table width="500px"> <tr> <td> item a </td> <td style="text-align:right;" colspan="2"> item b </td> </tr> <tr> <td> item c </td> <td style="text-align:right;"> item d </td> <td style="text-align:right;"> item e </td> </tr> </table> 

http://jsfiddle.net/A5LDZ/2/