CSS style for first <td> in a <tr>

I'm trying to set all the <td> elements of my <tr> to be right-aligned except the first one, which I want to be left-aligned. I tried this:

<style>
td { text-align: right };
td:first-child { text-align: left };
</style>

That makes all cells be right-aligned. If I swap the order of those two rows, then all cells are left-aligned. Highly confused. According to w3schools,

> The :first-child selector is used to select the specified selector, only if it is the first child of its parent.

But that doesn't seem to be happening for me.

Your syntax was incorrect.

td { text-align: right };                    /* This was being applied */
td:first-child { text-align: left };         /* This wasn't.. */

Should be:

td { text-align: right; }
td:first-child { text-align: left; }

Note the semi-colons - they shouldn't be outside of the brackets {}

Other than that, you were using :first-child properly.

jsFiddle demo

td:nth-child(2) { text-align: right; }

You can do that in one line.

Another option, depending on what you want to do:

table tr td {
    background-color:red;}
table tr td:nth-child(1) {
    background-color:green;}