Learn CSS Variables by Building a City Skyline - Step 78

HTML-CSS
1

Tell us what’s happening:

I keep getting the error code that I must not alter my first repeating-linear-gradient and I have not done that, please do help me grasp what is expected of me in this section. Thank you.

Your code so far

<!-- file: index.html -->


/* file: styles.css */
/* User Editable Region */

.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%);
}

/* User Editable Region */

Your browser information:

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

Challenge Information:

Learn CSS Variables by Building a City Skyline - Step 78

2

Try formatting your new gradient like the first one, so the variables are stacked on top of each other. It will make it easier to see the problem.

You’re right, the hint is mis-leading. You can ignore that.

1 Like
3

You can add color stops like this:

(var(--some-color)  0%  5%,  var(--some-color)  20% 40% )