Mixing table header <th> and table data <td> cells in a single table row <tr>

I have a set of survey questions each of which I am arranging in a single row table. I want the first entry to serve as a prompt and have been using <th> for that cell, as in:

<table style='width:100% table-layout:fixed;border-collapse: collapse;'>
  <tr>
    <th style='width:40%'>
      <b>How long were you on active surveillance?</b>
    </th>
    <td style='width:10%;'>f3_watchtime_num</td>
    <td style='width:5%'></td>
    <td style='width:50%;>f3_watchtime</td>
  </tr>
</table>

It seems to work OK but I have some reservations and questions about mixing <th> and <td> cells in a single <tr>:

Is this HTML5 Standards compliant? (Is there a W3C document that allows or prohibits this practice?)
Are there any downsides to this practice?

Thanks, David

Solution

1. Is this HTML5 Standards compliant? (Is there a W3C document that allows or prohibits this practice?)

W3C tr reference says it's content model can contain:

Content Model:
Zero or more td, th, and script-supporting elements
https://www.w3.org/TR/html5/tabular-data.html#the-tr-element

While your usage isn't very common, there isn't anything in W3C that forbids it.

2. Are there any downsides to this practice?

As for the use of th and td together, its accepted by W3C provided they are children of a tr element.
However, if you are displaying tabular data, (i.e. your survey results are data) using a table is fine. If you are using the table for layout purposes, you should use a CSS based layout instead.