How can I center-align the text inside one column?

Question

I am trying to center the <td> that contain numbers in them:

<tr>
    <td>October</td>
    <td align="center">1</td>
    <td>Cash</td>
    <td></td>
    <td>3</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
    <td>0</td>
</tr>

I didn't want to do:

<td align="center">3</td>

because I didn't want to have to add that in each individual cell. So I tried this:

 <tr>
    <td>October</td>
    <td align="center">1</td>
    <td>Cash</td>
    <td></td>
    <div class="centered">
        <td>3</td>
        <td>0</td>
        <td>0</td>
        <td>0</td>
        <td>0</td>
        <td>0</td>
    </div>
 </tr>

and added these in my css:

.centered {
    text-align: center; 
    align: center;
    float: center;
}

but they don't seem to work.

Answer 1

If it is always the same column(s), you can write your css rule like this:

/* Center 3rd column */
table td:nth-child(3) {
    text-align: center;
}

Or to center all but the 1st, 2nd, and 4th columns:

/* Center all columns */
table td {
    text-align: center;
}

/* Override rule above to left align specific columns */
table td:nth-child(1), table td:nth-child(2), table td:nth-child(4) {
    text-align: left;
}

/* Or simply apply 'text-left' class to desired td tags */
.text-left {
    text-align: left;
 }