City Skyline "background" CSS error

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.

The error message I’m getting is that I need to apply background to .bb1a even though I already have. I’ve looked up the background code on two different websites and both show that my code is how background is used so I do not understand why it’s showing an error. Any help is appreciated, thanks!

  **Your code so far**

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

  **Your browser information:**

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

Challenge: Step 40

Link to the challenge:

2

Look at how the background-color property is using the CSS custom properties (or variables if you prefer). You need to do the same thing for your new background property. Hint: You are leaving something out.

3

I fixed it, thanks for your help!

4

I am struggling with this one still… What is missing in the background property?

5

There are a few things. Mainly small.

The most important thing missing was “var” from the custom CSS inputs you created in the :root.

A couple of brackets as well, but proper use of the variables will provide correction on those syntax errors.

Should read:

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

I’ve marked the missing components of the code with asterisks for ease of recognition.

Because you made these variables in your :root, you MUST call them using this method:

var(--variable-color);

OR in combination, seperated with a comma, and stated again using ‘var()’.

linear-gradient( var(--variable-color1), var(--variable-color2));

Sometimes it just takes a minute to slow down, and match your brackets to one another to make sure you have complete statements.

Hope this helps!

1 Like
6

Thank you so much for helping me out with this one, much appreciated!!!

7

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