Learn CSS Variables by Building a City Skyline - Step 108

HTML-CSS
1

Tell us what’s happening:

Your code so far

WARNING

The challenge seed code and/or your solution exceeded the maximum length we can port over from the challenge.

You will need to take an additional step here so the code you wrote presents in an easy to read format.

Please copy/paste all the editor code showing in the challenge from where you just linked.

Replace these two sentences with your copied code.
Please leave the ``` line above and the ``` line below,
because they allow your code to properly format in the post.

Your browser information:

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

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

Link to the challenge:

2

hi there, did you have a question?

3

yes i do

.fb6 {
  width: 9%;
  height: 38%;
  background-color: var(--building-color3);
  background: repeating-linear-gradient(
    90deg,
    var(--building-color3),
    var(--building-color3) 10%,
    transparent 10%,
    transparent 30%,
  ),
  repeating-linear-gradient(
    var(-building-color3),
    var(-building-color3) 10%,
    var(-window-color3) 10%,
    var(-window-color3) 30%
    );
}

with this i am still getting errors, dont know how else to go about it

4

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

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

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

the variables should all start with 2 dashes.
You only have one dash…

6 
.fb6 {
  width: 9%;
  height: 38%;
  background-color: var(--building-color3);
  background: repeating-linear-gradient(
    90deg,
    var(--building-color3),
    var(--building-color3) 10%,
    transparent 10%,
    transparent 30%,
  ),
  repeating-linear-gradient(
    var(--building-color3),
    var(--building-color3) 10%,
    var(--window-color3) 10%,
    var(--window-color3) 30%
    );
}
7

hi there, we cannot read your code properly if you do not format it correctly for the forum. Please edit your post as per the instructions I shared with you earlier

8

after making the correction i am still having the same issues, it is telling me ( You should give .fb6 a second repeating-linear-gradient in the background property)

.fb6 {
  width: 9%;
  height: 38%;
  background-color: var(--building-color3);
  background: repeating-linear-gradient(
    90deg,
    var(--building-color3),
    var(--building-color3) 10%,
    transparent 10%,
    transparent 30%,
  ),
  repeating-linear-gradient(
    var(--building-color3),
    var(--building-color3) 10%,
    var(--window-color3) 10%,
    var(--window-color3) 30%
    );
}
9

try removing this extra comma here

1 Like
10

Thanks alot sir it worked

1 Like
11

TL,TR the Answer is :

mod edit: solution redacted

Goodluck.

12

please don’t post solutions to fcc challenges in the forum.

13