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

Step 28

Create a new div with a class value of three right under the .two element. This will be your third rectangle.
Hint- Your new div should be nested in your .canvas element.
unable to identify the problem

  **Your code so far**
/* file: styles.css */
.canvas {
width: 500px;
height: 600px;
background-color: #4d0f00;
overflow: hidden;

.frame {
border: 50px solid black;
width: 500px;
padding: 50px;
margin: 20px auto;

.one {
width: 425px;
height: 150px;
background-color: #efb762;
margin: 20px auto;

.two {
width: 475px;
height: 200px;
background-color: #8f0401;
margin: auto;
/* file: index.html */
<!DOCTYPE html>
<html lang="en">
  <meta charset="UTF-8">
  <title>Rothko Painting</title>
  <link href="./styles.css" rel="stylesheet">
  <div class="frame">
    <div class="canvas">
      <div class="one">
      <div class="two">
     <div class="three"></div>
  **Your browser information:**

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

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

Link to the challenge:

You put these divs inside of each other instead of

Thanks alot for giving me your valuable guidence

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