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

Tell us what’s happening:

how can do this one . i don’t understand how to do it , anyone to help me ?

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>

<!-- User Editable Region -->


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

<!-- User Editable Region -->

  </body>

Your browser information:

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

Challenge Information:

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

you can’t put a tag inside an other, delete the extra > at the end, and add one > after class="canvas"

after that you will be missing a closing </div> tag

2 Likes

here is the message of error i’m getting: Your .canvas element should be nested in the new div element.

It means that the div with class of frame should have the opening tag before the .canvas div, and the closing tag after the closing tag of the .canvas div

what is your code now?

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

still occur error message: You should add a new div element.

Hi,

You need to close this div tag with >

here occur this message : Your .canvas element should be nested in the new div element.

I would recommend restarting this step using the reset button
image

This way you can start again without all your edits.

You can post your most recent attempt by copying and pasting the code into a reply with three backticks before and after the code block.
If you cant find a backtick on your keyboard, use ALT + 096 on the keypad to display one.

Here is some example code, its not the answer, but may give you an idea of how you can structure your code:

<p class="exampleClass">This is an example</p>

Example below shows how to wrap the paragraph element in a div and give that div the ‘test’ class.

<div class="test">
  <p class="exampleClass">This is an example</p>
</div>

You have wrapped .frame inside .canvas. You should do it the other way. Swap the class names and that will nest .canvas inside the new div which is .frame.

thank you for support ,it works

1 Like