Design a Set of Colored Boxes - Design a Set of Colored Boxes

HTML-CSS
1

Tell us what’s happening:

I am not sure why the tests are not passing because everything seems right and should pass with no issue.

Tests 1, 5, 6, and 11 are not passing

  1. body should have a background color of #f4f4f4 - very first rule in the CSS file
  2. The .color-box class should have the width and height properties set. - second rule in the CSS file
  3. The .color-box elements should always have a non-zero width and height. Try to resize the preview to a smaller size, make sure that the boxes do not disappear. - same as test 5
  4. The .color5 element should have a background color set. - Last rule in the CSS file

This should be passing.

Please help!

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Colored Boxes</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
<div class="color-grid">
  <div class="color-box color1"></div>
  <div class="color-box color2"></div>
  <div class="color-box color3"></div>
  <div class="color-box color4"></div>
  <div class="color-box color5"></div>
</div>
</body>
</html>

/* file: styles.css */


body {
  background-color: #f4f4f4;
}

.color-box {
  width: 100px;     
  height: 100px;
}

.color1 {
  background-color: #ff5733;  
}

.color2 {
  background-color: rgb(100, 150, 200);  
}

.color3 {
  background-color: blue;     
}

.color4 {
  background-color: hsl(120, 60%, 70%);  
}

.color5 {
  background-color: red;      
}

Your browser information:

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

Challenge Information:

Design a Set of Colored Boxes - Design a Set of Colored Boxes

2

hello!

Check if the html is linked to the correct css file.