I have a table html like the following:
<code><body>
<table>
<tbody>
<tr>
<th>Header 1</th>
<td>Data 1</td>
<th>Header 2</th>
<td>Data 2</td>
</tr>
<tr>
<th>Header 3</th>
<td>Data 3</td>
<th>Header 4</th>
<td>Data 4</td>
<th>Header 5</th>
<td>Data 5</td>
</tr>
</tbody>
</table>
</body>
</code>
<code><body>
<table>
<tbody>
<tr>
<th>Header 1</th>
<td>Data 1</td>
<th>Header 2</th>
<td>Data 2</td>
</tr>
<tr>
<th>Header 3</th>
<td>Data 3</td>
<th>Header 4</th>
<td>Data 4</td>
<th>Header 5</th>
<td>Data 5</td>
</tr>
</tbody>
</table>
</body>
</code>
<body>
<table>
<tbody>
<tr>
<th>Header 1</th>
<td>Data 1</td>
<th>Header 2</th>
<td>Data 2</td>
</tr>
<tr>
<th>Header 3</th>
<td>Data 3</td>
<th>Header 4</th>
<td>Data 4</td>
<th>Header 5</th>
<td>Data 5</td>
</tr>
</tbody>
</table>
</body>
I want the table to look something like this:
<code> Header1 Header2
td1 td2
Header3 Header4 Header5
td3 td4 td5
</code>
<code> Header1 Header2
td1 td2
Header3 Header4 Header5
td3 td4 td5
</code>
Header1 Header2
td1 td2
Header3 Header4 Header5
td3 td4 td5
Can this be achieved using CSS without changing the html structure?