CSS Box Model by Building a Rothko Painting Step 11

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.

  **Your code so far**

\ file: .canvas {
width: 500px;
height: 600px;
background-color: #4d0f00;
}
.canvas {
width: 500px;
height: 600px;
background-color: #4d0f00;
}

\ file: <!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Rothko Painting</title>
  <link href="./styles.css" rel="stylesheet">
</head>
<body>
<div id="canvas" class="frame">
</div>
  <div class="canvas">
  </div>

</body>
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Rothko Painting</title>
  <link href="./styles.css" rel="stylesheet">
</head>
<body>
<div id="canvas" class="frame">
</div>
  <div class="canvas">
  </div>

</body>

  **Your browser information:**

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

Challenge: Step 11

Link to the challenge:

What this Step exactly want from it? how can i wrap in the .canvas? and really .canvas instead of normal canvas?

2

Hello,
You need two divs, it will be easier to grasp in reversed order:

  • First, you create a div with the class “frame”
  • Inside that div you create another one that is “canvas”
4 Likes
3

wtf didnt know, i can do two div elements beside each other

this has worked for me. Thanks
4

This really helps to understands it easier,
Thank you!

1 Like
5

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