CSS nth-child not working

[stuartinoz]

So I have the following CSS and HTML table, all adjustments to CSS td work fine, but cannot get td:nth-child(3) to work at all to justify the third column, where am I going wrong??

<style type="text/css">
        table {
            font-size:8px;
                        border-collapse: collapse;
            border: 1px solid black;
            background-color: transparent;
                        width: 100%;
                 }
        td {
            font-size:8px;
                        padding: 1px;
            border: 1px solid black;
            text-align: left;
            background-color:white;
        }
                th {
            font-size: 8px;
                        padding: 1px;
            border: 1px solid black;
            text-align: left;
            background-color: #01397C;
                        color: white;
        }
                td:nth-child(3) {
                  text-align: center; }
    </style>

<table>
 <thead>
  <tr><th>Asset No.</th><th>Purchase Order No.</th><th>Date of Purchase</th><th>Serial No.</th><th>Manufacturer</th><th>Part No.</th><th>Description</th><th>Voltage</th><th>Warranty Expires</th><th>Service Due Date</th><th>Service Interval</th><th>First Name</th><th>Surname</th></tr>
 </thead>
<tbody>
  <tr><td>VIV0202</td><td>N/A</td><td>02/03/2023</td><td>22-216911</td><td>Bosch</td><td>GST18VLI</td><td>Jigsaw</td><td>18v</td><td>01/03/2026</td><td></td><td>-0.759146341</td><td>Chris</td><td>Ellis</td></tr>
  <tr><td>VIV1202</td><td>-16453139.31</td><td>09/03/2023</td><td>SDV</td><td>DeWalt</td><td>654-5664 XR</td><td>Combi Drill</td><td>18v</td><td>08/03/2026</td><td></td><td>-46.49085366</td><td></td><td></td></tr>
  <tr><td>VIV2020</td><td>-130152.0045</td><td></td><td></td><td>DeWalt</td><td>Screwdriver</td><td>dflvkmdfb</td><td>N/A</td><td></td><td></td><td>4.225609756</td><td></td><td></td></tr>
  <tr><td>VIV2021</td><td>-179051.473</td><td>01/03/2023</td><td></td><td>DeWalt</td><td>XR 18v 988</td><td>Brushless Combi Drill</td><td>18v</td><td>01/03/2025</td><td></td><td>4.179878049</td><td>Me</td><td></td></tr>
  <tr><td>VIV2022</td><td></td><td>31/03/2023</td><td></td><td>Bosch</td><td>GBH36V-LI Plus</td><td>36v 3-mode SDS plus hammer drill</td><td>36v</td><td>31/03/2026</td><td>30/09/2025</td><td>4.134146341</td><td></td><td></td></tr>
  <tr><td>VIV2023</td><td>N/A</td><td>02/03/2023</td><td>-377813097.4</td><td>Bosch</td><td>NRV240-13</td><td>Vacuum cleaner</td><td>240v</td><td>02/03/2024</td><td>19/04/2023</td><td>4.088414634</td><td>Ash</td><td>Rod</td></tr>
  <tr><td>VIV2024</td><td>N/A</td><td>31/03/2023</td><td>-444493751.5</td><td>Bosch</td><td>GAL18V-42</td><td>Battery charger</td><td>240v</td><td>31/03/2025</td><td></td><td>4.042682927</td><td>Chris</td><td>Ell</td></tr>
  <tr><td>VIV2025</td><td>N/A</td><td>12/05/2020</td><td>-511174405.6</td><td>Bosch</td><td>GST18VLI</td><td>Jigsaw</td><td>18v</td><td>12/05/2023</td><td></td><td>3.99695122</td><td>Chris</td><td>Ell</td></tr>
  <tr><td>VIV2026</td><td>N/A</td><td>31/03/2023</td><td>-577855059.7</td><td>Bosch</td><td>GAL18V-42</td><td>Battery charger</td><td>240v</td><td>31/03/2025</td><td>30/09/2023</td><td>3.951219512</td><td>Chris</td><td>Ell</td></tr>
  <tr><td>VIV2027</td><td>N/A</td><td>02/03/2023</td><td>654321</td><td></td><td></td><td></td><td></td><td></td><td></td><td></td><td>Chris</td><td>Ell</td></tr>
  <tr><td>VIV2028</td><td>999</td><td>10/04/2023</td><td>newSerial </td><td>Bosch</td><td>GAL18V-40</td><td>Battery charger</td><td>240v</td><td>10/04/2025</td><td>10/04/2024</td><td>6</td><td>Bob</td><td>Down</td></tr><tr>
  <td>VIV2029</td><td>15465</td><td>10/04/2023</td><td>SN165464</td><td>SkyVac</td><td>Commercial</td><td>Gutter vacuum</td><td>240v</td><td>10/04/2025</td><td>10/04/2024</td><td>12</td><td></td><td></td></tr>
</tbody>
</table>

 

[Malcolm]

Welcome to Code Forum!

Are you trying to justify all the content in column 3 to the center?

 

[stuartinoz]

Hi Malcolm,
Yes exactly that but I can only adjust the CSS. The HTML is being generated externally and above is only an example of the output. Any help appreciated.

 

[Malcolm]

Hi Malcolm,
Yes exactly that but I can only adjust the CSS. The HTML is being generated externally and above is only an example of the output. Any help appreciated.

Okay, so something like this?

 

[stuartinoz]

Okay, so something like this?
View attachment 2086

That’s the one yes….can’t get nth-child to work….

 

[Malcolm]

That’s the one yes….can’t get nth-child to work….

So for me it worked without actually doing anything, can you share what you're seeing?

 

[stuartinoz]

So for me it worked without actually doing anything, can you share what you're seeing?

Yeah it's a little strange. As a flat html file it works for me too (not sure why I didn't check this first). I'm utilising this in a Compose html function within Power Automate against an output of Create HTML table. All other CSS working, so if I justify/format the td or th sections it happens, but nothing changes with td:nth-child(n)..... May just have to accept this one.... Thanks for your help