Learn CSS Variables by Building a City Skyline - Step 21

Tell us what’s happening:
Please how do I get past this step, I have done my best at the solution but still, it says to add a new 5 div my question is where do I put the div?

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">    
  <head>
    <meta charset="UTF-8">
    <title>City Skyline</title>
    <link href="styles.css" rel="stylesheet" />   
  </head>

  <body>

<!-- User Editable Region -->

<div></div>
    <div></div>
    <div class="background-buildings">
       <div></div>
        <div></div>
        <div class="bb1">
            <div class="bb1a"></div>
            <div class="bb1b"></div>
            <div class="bb1c"></div>
            <div class="bb1d"></div>
        </div>
        <div class="bb2"></div>
        <div class="bb3"></div>
        <div></div>
        <div class="bb4"></div>
        <div></div>
        <div></div>
    </div>
    <div></div>
    <div></div>
  </body>

<!-- User Editable Region -->

</html>
/* file: styles.css */
* {
  border: 1px solid black;
  box-sizing: border-box;
}

body {
  height: 100vh;
  margin: 0;
  overflow: hidden;
}

.background-buildings {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: space-evenly;
}

.bb1 {
  width: 10%;
  height: 70%;
  display: flex;
  flex-direction: column;
  align-items: center;
  --building-color1: #aa80ff;
}

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

.bb1b {
  width: 80%;
  height: 10%;
  background-color: var(--building-color1);
}

.bb1c {
  width: 90%;
  height: 10%;
  background-color: var(--building-color1);
}

.bb1d {
  width: 100%;
  height: 70%;
  background-color: var(--building-color1);
}

.bb2 {
  width: 10%;
  height: 50%;
}

.bb3 {
  width: 10%;
  height: 55%;
}

.bb4 {
  width: 11%;
  height: 58%;
}
    

Your browser information:

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

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

Link to the challenge:

You added two new divs above (or before) the .background-buildings element and two new divs below (or after) the .background-buildings element. The instructions did not ask you to do that. Remove those four divs and you should pass.

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