After coding the Availability Table, I have it all working except for question 35. I've attached my code and css

HTML-CSS
1

`

<link rel="stylesheet" href="styles.css">

<meta charset="utf-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Availability Table</title>

<table>

    <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</th>

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

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

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

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

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

        </tr>

        <tr class="half">

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

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

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

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

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

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

        </tr>

        <tr class="sharp">

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

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

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

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

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

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

        </tr>

        <tr class="half">

            <th class="time">8:00</th>

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

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

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

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

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

        </tr>

    </tbody>

</table>

<div id="legend">

    <span>Availability</span>

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

</div>
\`
2

Please Tell us what’s happening in your own words.

Learning to describe problems is hard, but it is an important part of learning how to code.

Also, the more you say, the more we can help!

3

When I enter the appropriate code, I’ve tried several versions,

#legend-gradient {

  height: 20px;

  width: 50%;  

  background-image: linear-gradient(

    to right, 

  var(--color0)0%, var(--color0)17%,

  var(--color1)17%, var(--color1)33%, 

  var(--color2)33%, var(--color2)50%, 

  var(--color3)50%, var(--color3)67%, 

  var(--color4)67%, var(--color4)83%, 

  var(--color5)83%, var(--color5)100%);

} \`

but check #35:`You should use two color-stops (expressed in percentage) to make the transition from one color to the following color a hard line for your#legend-gradient. Remember to use your --color# variables.` keeps being caught.

I’ve tried with the second variable, I’ve tried without the second variable, I’ve tried, while testing, named colors, and I’ve tried instead of 6 lines using 3 lines…I still get the error.

4

I’ve edited your post to improve the readability of the code. When you enter a code block into a forum post, please precede it with three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add the backticks.

Pre-formatted-text
Pre-formatted-text1356×380 401 KB

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

5

That doesn’t look like other examples of using color stops that I’ve seen?

6

Thank you for revising this to make it easier to read.

7

I’ve tried this to no avail….

#legend-gradient {

  height: 20px;

  width: 50%;  

  background-image: linear-gradient(

    to right, 

  var(--color0) 0% var(--color0) 17%,

  var(--color1) 17% var(--color1) 33%, 

  var(--color2) 33% var(--color2) 50%, 

  var(--color3) 50% var(--color3) 67%, 

  var(--color4) 67% var(--color4) 83%, 

  var(--color5) 83% var(--color5) 100%);

}
8

That syntax doesn’t look like the syntax in the MDN example.

And when you format your code the three backticks should be on a separate line before and after the code. I edited it for you. I find it easier to just use the </> on the toolbar to format code.

9

It doesn’t look like you changed anything after the link I posted? I would really look at the example in that link.