Learn CSS Variables by Building a City Skyline - Step 78

HTML-CSS
1

So this is my code:

.fb1c {
width: 100%;
height: 80%;
background: repeating-linear-gradient(
90deg,
var(–building-color4),
var(–building-color4) 10%,
transparent 10%,
transparent 15%
),repeating-linear-gradient(
var(–building-color4)0%,
var(–building-color4)10%,
var(window-color4)10%,
var(window-color4)90%,
)
}

And the error is "You should not alter the first repeating-linear-gradient ".
I did change a few things this and that in those 2 repearing linear but it still error.
Can someone explain it to me?

Thank you

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/115.0.0.0 Safari/537.36

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

Link to the challenge:

2

Oh yeah, I forgot to put the instruction:

You can add multiple gradients to an element by separating them with a comma (,) like this:

gradient1(
  colors
),
gradient2(
  colors
);

Add a repeating-linear-gradient to .fb1c below the one that’s there; use your --building-color4 from 0% to 10% and --window-color4 from 10% and 90%. This will fill in behind the gradient you added last.

3

Sorry ! Now I found the error, the error was var(window-color4)
but now I changed it to var(–window-color4) now the error is: You should use a second color of --window-color4 from 10% to 90%

and this is my new code:
.fb1c {
width: 100%;
height: 80%;
background: repeating-linear-gradient(
90deg,
var(–building-color4),
var(–building-color4) 10%,
transparent 10%,
transparent 15%
),
repeating-linear-gradient(
var(–building-color4),
var(–building-color4)10%
var(–window-color4)10%,
var(–window-color4)90%,
)
}

1 Like
4

Congratulations on finding the error.
Great job of sticking with it while waiting! :slight_smile:
Happy coding!

5

now i’m stuck in the new error with the same step,

the error is:
You should use a second color of --window-color4 from 10% to 90%

can you give me hint about this error?

6

@rwahyu21x Are you able to post your updated code using < /> Preformatted so we can find the issue for you?

It may be something as small as a ; behind the final color brackets.

7

this is the code:
.fb1c {
width: 100%;
height: 80%;
background: repeating-linear-gradient(
90deg,
var(–building-color4),
var(–building-color4) 10%,
transparent 10%,
transparent 15%
),
repeating-linear-gradient(
var(–building-color4),
var(–building-color4)10%
var(–window-color4) 10%,
var(–window-color4) 90%
var(–window-color4) 90%
)
}

8

I suggest removing the extra var(–window-color4) 90%.

As well, please look at these directions again?

use your --building-color4 from 0% to 10% and --window-color4 from 10% and 90%
It should be entered like this with the above information.

repeating-linear-gradient(var(–building-color4),
var(–building-color4) 10%,
transparent 10%,
transparent 15%);

9

so it should be like this ?

.fb1c {
width: 100%;
height: 80%;
background: repeating-linear-gradient(
90deg,
var(–building-color4),
var(–building-color4) 10%,
transparent 10%,
transparent 15%
),
repeating-linear-gradient(
var(–building-color4),
var(–building-color4)10%
var(–window-color4) 10%,
var(–window-color4) 90%
)
}

and it’s still error with the same error
and i’m sorry that was my mistake

10

We are all here to help each other.

11

it’s still error :sob: with that code :sob:

12

OMG nevermind i found it, i forgot to put the comma after 10%.
thank you so much for helping me this far !
have a good day !

1 Like
13

Good effort! Keep up the very good progress!