Trying to code table with column and row header, my output is printing Column headers starting from Col2 Row1 and Row headers starting from Col1 Row2 (Col1 Row1 is empty). I need current column header start from Col1 Row1. My html code is:
<table>
<caption>Volumes Consumption</caption>
<tr>
<td></td>
<th scope="col">Performance Tier
</th>
<th scope="col">Contracted Value</th>
<th scope="col">Consumed Value</th>
<th scope="col">Contract Numbers</th>
</tr>
<tr>
<th scope="row">Extreme-MC</th>
<td>1</td>
<td>1</td>
<td>1</td>
<td>1</td>
</tr>
<tr>
<th scope="row">Premium-MC</th>
<td>2</td>
<td>2</td>
<td>2</td>
<td>2</td>
</tr>
<tr>
<th scope="row">Premium</th>
<td>3</td>
<td>3</td>
<td>3</td>
<td>4</td>
</tr>
<tr>
<th scope="row">Value</th>
<td>4</td>
<td>4</td>
<td>4</td>
<td>4</td>
</tr>
2
Answers
Removed the extra
<td>
and</td>
, and reduced the row<td>
to 3 from 4.If I understood it right, this should be your missing piece. I have just removed
<td></td>
from the very beginning,<tr> <td></td> <th scope="col">Performance Tier </th>