Learn CSS Variables by Building a City Skyline - Step 10

HTML-CSS
1

Tell us what’s happening:

</div>
.bb1 {
  width: 10%;
  height: 70%;
}

code does not pass.

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 class="background-buildings">
      <div class="bb1"></div>
      
    </div>
    .bb1 {
      width: 10%;
      height: 70%;
    }

<!-- User Editable Region -->

  </body>
</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%;
}

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/17.5 Safari/605.1.15

Challenge Information:

Learn CSS Variables by Building a City Skyline - Step 10

2

You don’t really have CSS mixed in with your HTML, do you? You can’t do that, at least not without using the style element, which you shouldn’t. You need to move the CSS to the styles.css file.

“Open your styles.css file, and give .bb1 a width of 10% and height of 70%.”

3

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