Build a Set of Colored Markers - Step 12

HTML-CSS
1

Tell us what’s happening:

guys can you help me with this please I don’t know what they want

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 Markers</title>
    <link rel="stylesheet" href="styles.css">
  </head>
  <body>
    <h1>CSS Color Markers</h1>
    <div class="container">
      <div class="marker one">
      </div>
      <div class="marker">
      </div>
      <div class="marker">
      </div>
    </div>
  </body>
</html>

/* file: styles.css */

/* User Editable Region */

/* Center the heading */
h1 {
  text-align: center;
}

/* Container styling */
.container {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 20px;
}

/* Marker styling */
.marker {
  width: 200px;
  height: 25px;
  border-radius: 5px;
  margin: 10px auto; /* vertical spacing + center horizontally */
  /* DO NOT add background-color here */
}

/* Individual colors */
.one {
  background-color: red;
}

.two {
  background-color: blue;
}

.three {
  background-color: green;
}


/* User Editable Region */

Your browser information:

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

Challenge Information:

Build a Set of Colored Markers - Step 12

2

Hello :slight_smile:

They just asked you to remove a specific property and its value, I think you added new properties and values yourself, so it may be failing. Try to follow whats mentioned.

I hope it helps, happy coding :slight_smile:

3

Hi @adamelmao

The instructions did not ask you to add three new selectors, or add comments.

Try removing the new selectors and the comments.

Anything extra can cause the tests to fail.

Looks like in this case, the tests do not expect the background property in the CSS.

Happy coding