JSFiddle - React, Tailwind, and code Playground
HTML
<table>
<tr>
<td>Report Results 1</td><th><div>01</div></th>
</tr>
<tr>
<td>Report Results 1</td><th><div>02</div></th>
</tr>
<tr>
<td>Report Results 1</td><th><div>03</div></th>
</tr>
<tr>
<td>This is too long for one line and I don't like it like that.</td><th><div>04</div></th>
<tr>
<td>Line</td><th><div>05</div></th>
</tr>
</table>
CSS
body { font-family: "Times New Roman", Times, serif; padding:10px; }
td, tr, th, table { border:1px solid #333; }
tr:nth-child(odd) td { background:#eee; } /* No IE, No Cares */
table {
margin: 0 20px;
width: 200px;
-webkit-transform: rotate(-90deg);
-moz-transform: rotate(-90deg);
-o-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
}
th div {
-webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg);
-o-transform: rotate(90deg);
-ms-transform: rotate(90deg);
}
table td, table th {
padding: 10px;
}