Test 35 is not passing for availability table

HTML-CSS
1
Availability Table

Team Availability

<thead>

  <tr>

    <th></th>

    <th>Monday</th>

    <th>Tuesday</th>

    <th>Wednesday</th>

    <th>Thursday</th>

    <th>Friday</th>

  </tr>

</thead>

<tbody>

  <tr class="sharp">

    <th class="time">9:00 AM</th>

    <td class="available-1"></td>

    <td class="available-3"></td>

    <td class="available-5"></td>

    <td class="available-2"></td>

    <td class="available-0"></td>

  </tr>

  <tr class="half">

    <th class="time">11:00 AM</th>

    <td class="available-2"></td>

    <td class="available-4"></td>

    <td class="available-1"></td>

    <td class="available-0"></td>

    <td class="available-3"></td>

  </tr>

  <tr class="sharp">

    <th class="time">1:00 PM</th>

    <td class="available-5"></td>

    <td class="available-2"></td>

    <td class="available-4"></td>

    <td class="available-1"></td>

    <td class="available-3"></td>

  </tr>

  <tr class="half">

    <th class="time">3:00 PM</th>

    <td class="available-0"></td>

    <td class="available-1"></td>

    <td class="available-3"></td>

    <td class="available-5"></td>

    <td class="available-2"></td>

  </tr>

  <tr class="sharp">

    <th class="time">5:00 PM</th>

    <td class="available-4"></td>

    <td class="available-0"></td>

    <td class="available-2"></td>

    <td class="available-3"></td>

    <td class="available-5"></td>

  </tr>

</tbody>

<span>Availability</span>

<div id="legend-gradient"></div>

CSS

:root {

–color0: #f8d7da;

–color1: #f5c6cb;

–color2: #ffeeba;

–color3: #d4edda;

–color4: #bee5eb;

–color5: #c3e6cb;

–solid-border: 2px solid #000;

–dashed-border: 2px dashed #000;

}

body {

font-family: sans-serif;

padding: 10px;

font-size: 16px;

}

table {

border-collapse: collapse;

margin: 20px auto;

text-align: center;

}

th, td {

border: 1px solid #000;

padding: 10px;

}

th.time {

background-color: #f0f0f0;

}

.available-0 { background-color: var(–color0); }

.available-1 { background-color: var(–color1); }

.available-2 { background-color: var(–color2); }

.available-3 { background-color: var(–color3); }

.available-4 { background-color: var(–color4); }

.available-5 { background-color: var(–color5); }

.sharp td {

border-bottom: var(–solid-border);

}

.half td {

border-bottom: var(–dashed-border);

}

#legend {

margin: 20px auto;

width: 50%;

text-align: center;

}

#legend span {

display: block;

margin-bottom: 10px;

font-weight: bold;

}

#legend-gradient{width:100%;height:20px;border:1px solid #333;background-image:linear-gradient(to right,var(–color0) 0%,var(–color0) 16%,var(–color1) 16%,var(–color1) 33%,var(–color2) 33%,var(–color2) 50%,var(–color3) 50%,var(–color3) 66%,var(–color4) 66%,var(–color4) 83%,var(–color5) 83%,var(–color5) 100%)}

2

you are not using multi stop syntax

See Gradient with multi-position color-stops

Please when you need help use the HELP button to create a topic

If you have a question about a specific challenge as it relates to your written code for that challenge and need some help, click the Get Help > Ask for Help button located on the challenge.

image
image493×196 5.09 KB

The Ask for Help button will create a new topic with all code you have written and include a link to the challenge also. You will still be able to ask any questions in the post before submitting it to the forum.

Thank you.