Learn CSS Variables by Building a City Skyline - Step 40

HTML-CSS
1

Tell us what’s happening:

I’m trying to complete this step but I don’t know what is wrong …

Step 40

Gradients in CSS are a way to transition between colors across the distance of an element. They are applied to the background property and the syntax looks like this:

gradient-type(
  color1,
  color2
);

In the example, color1 is solid at the top, color2 is solid at the bottom, and in between it transitions evenly from one to the next. In .bb1a, add a gradient of type linear-gradient to the background property with --building-color1 as the first color and --window-color1 as the second.

And this is the hint:

You should give the background a linear-gradient ending at --window-color1 .

  **Your code so far**

.bb1a {
width: 70%;
height: 10%;
background-color: var(–building-color1);
background: linear-gradient(var(
–building-color1,
–window-color1));





      **Your browser information:**

User Agent is: <code>Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/103.0.0.0 Safari/537.36</code>

**Challenge:**  Learn CSS Variables by Building a City Skyline - Step 40

**Link to the challenge:**
https://www.freecodecamp.org/learn/2022/responsive-web-design/learn-css-variables-by-building-a-city-skyline/step-40
2

the code below you entered so far, is mostly complete except you are missing one tiny “)”. Remember the var has to () both color 1 and 2. Hope this helps!
.bb1a {
width: 70%;
height: 10%;
background-color: var(–building-color1);
background: linear-gradient(var(
–building-color1,
–window-color1));

3

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.