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

HTML-CSS
1

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

   **Your code so far**

/* file: styles.css */
.canvas {
 width: 500px;
 height: 600px;
 background-color: #4d0f00;
 overflow: hidden;
 filter: blur(2px);
}

.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: 0 auto 20px;
}

.one, .two {
 filter: blur(2px);
}

.three {
 width: 91%;
 height: 28%;
 background-color: #b20403;
margin: auto;
filter:blur(2px);
}


/* 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="frame">
     <div class="canvas">
       <div class="one"></div>
       <div class="two"></div>
       <div class="three"></div>
     </div>
   </div>
 </body>
</html>

   **Your browser information:**

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/104.0.0.0 Safari/537.36

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

Link to the challenge:

2

Hey! Welcome to the freeCodeCamp’s community forums.

Learning to describe the bugs or issues you’re facing is a great skill to have in a developer, it may seem hard at first, but you should at least provide a brief summary of what you are trying to accomplish and what’s the error that shows up when you try to run your code.

You can add any and all of the questions that you might have in the following section

Tell us what’s happening:

It will also make it easier for others to help you if they know the problem beforehand.

3

I was facing problem. Step was to add CSS property to .three . I did the same it didn’t allowed me to move forward but when I changed the browser problem got fixed itself

1 Like
4

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