Tell us what’s happening:
Test 39 is failing: “All table header cells in the first column should have a scope attribute with the value row.”
My body rows start with <th class="time" scope="row"> elements, but the test still fails. How can I structure the first column headers properly so test 39 passes?
and in th i add scope row it tells me to get col n when i replace it back to col it says all tables header should have row… i am stuck in loop ![]()
Your code so far
<!-- file: index.html --> <table>
<caption>Weekly Meeting Availability Schedule</caption>
<thead>
<tr>
<th scope='col'>Time</th>
<th scope='col'>Monday</th>
<th scope='col'>Tuesday</th>
<th scope='col'>Wednesday</th>
<th scope='col'>Thursday</th>
<th scope='col'>Friday</th>
<th scope='col'>Saturday</th>
<th scope='col'>Sunday</th>
</tr>
</thead>
<tbody>
<tr class="sharp">
<th class="time" scope="row">9:00 AM</th>
<td class="available-5" aria-label="5+ available"></td>
<td class="available-3" aria-label="3 available"></td>
<td class="available-2" aria-label="2 available"></td>
<td class="available-4" aria-label="4 available"></td>
<td class="available-1" aria-label="1 available"></td>
<td class="available-0" aria-label="0 available"></td>
</tr>
<tr class="half">
<th class="time" scope="row">10:00 AM</th>
<td class="available-2" aria-label="2 available"></td>
<td class="available-4" aria-label="4 available"></td>
<td class="available-5" aria-label="5+ available"></td>
<td class="available-0" aria-label="0 available"></td>
<td class="available-3" aria-label="3 available"></td>
<td class="available-1" aria-label="1 available"></td>
</tr>
<tr class="sharp">
<th class="time" scope="row">11:00 AM</th>
<td class="available-1" aria-label="1 available"></td>
<td class="available-0" aria-label="0 available"></td>
<td class="available-3" aria-label="3 available"></td>
<td class="available-5" aria-label="5+ available"></td>
<td class="available-2" aria-label="2 available"></td>
<td class="available-4" aria-label="4 available"></td>
</tr>
<tr class="half">
<th class="time" scope="row">12:00 PM</th>
<td class="available-4" aria-label="4 available"></td>
<td class="available-5" aria-label="5+ available"></td>
<td class="available-1" aria-label="1 available"></td>
<td class="available-2" aria-label="2 available"></td>
<td class="available-0" aria-label="0 available"></td>
<td class="available-3" aria-label="3 available"></td>
</tr>
</tbody>
</table>
/* file: styles.css */
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/151.0.0.0 Safari/537.36
Challenge Information:
Build an Availability Table - Build an Availability Table