Html Table alignment right

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 a table, and I'd like them to each have a left aligned item, and some right aligned items, like 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 lining up with item d and not right?

Edit: Jsfiddle

Answer 1

You had some incorrect syntax. You were using style="align-right" when I believe you meant style="text-align:right;". You also need to add a colspan="2" to the <td> which needs to span 2 columns - aka the "item b" cell:

<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/