Learn the CSS Box Model by Building a Rothko Painting - Step 11

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.
its telling me /

Hint

Your .canvas element should be nested in the new div element.

  **Your code so far**

/* file: styles.css */
.canvas {
width: 500px;
height: 600px;
background-color: #4d0f00;
}

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

  <div class="canvas">
    <div> 
      .canvas
    </div>
  </div>

</body>

  **Your browser information:**

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

Challenge: Learn the CSS Box Model by Building a Rothko Painting - Step 11

Link to the challenge:

2

when writing HTML, we must follow HTML rules.
What does an element in HTML look like?

3

elements get surrounded by < and > but i dont understand because how does .canvas go between < & > and work properly without error how does that work because i dont remember learning that.

4

The CSS syntax .canvas is being used as a shortcut for saying “the element with a class of ‘canvas’”. This is a popular thing to do so you’ll want to get used to it :slight_smile:

So when the instructions say:

“Wrap the .canvas element…”

You can replace that with “Wrap the element with a class of ‘canvas’…”

5

do you see here any element that has a class “canvas” ?
Edit: since the exercise want you to wrap the element .canvas in another div, you should restart the step to reset the code, then find the element that has a class canvas and put it inside your new div element.

6

thank you that helped me solve the problem.

7

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