Learn CSS Colors by Building a Set of Colored Markers - Step 84

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here. i am not understanding what they mean . Need help like real quick

  **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 red">
      <div class="cap"></div>
      <div class="sleeve"></div>
    </div>
    <div class="marker green">
    </div>
    <div class="marker blue">
    </div>
  </div>
</body>
</html>

/* file: styles.css */
h1 {
text-align: center;
}

.container {
background-color: rgb(255, 255, 255);
padding: 10px 0;
}

.marker {
width: 200px;
height: 25px;
margin: 10px auto;
}

.cap {
width: 60px;
height: 25px;
}

.sleeve {
width: 110px;
height: 25px;
background-color: rgba(255, 255, 255, 0.5);
 border-left: 10 double rgba(0, 0, 0, 0.75);
}

.cap, .sleeve {
display: inline-block;
}

.red {
background: linear-gradient(rgb(122, 74, 14), rgb(245, 62, 113), rgb(162, 27, 27));
}

.green {
background: linear-gradient(#55680D, #71F53E, #116C31);
}

.blue {
background: linear-gradient(hsl(186, 76%, 16%), hsl(223, 90%, 60%), hsl(240, 56%, 42%));
}


  **Your browser information:**

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

Challenge: Learn CSS Colors by Building a Set of Colored Markers - Step 84

Link to the challenge:

2

Here is the task.

The black color of your border looks pretty harsh against the more transparent sleeve. You can use an alpha channel to lower the opacity of the black border.

For the border-left shorthand property, use the rgba function to set the color value to pure black with 75% opacity.

What parts of it are not clear?

3

pls can u be clear with ur suggestion

4

My suggestion is that

you will ask more specific questions about the task, since you said you don’t understand what they mean.

What exactly did you not understand? I kinda need to know that to proceed

5

thank u it was relly helpfull

6

Just making sure: you marked my reply as solution.

That usually means that you don’t need more help about this challenge.

Is that the case?

7

yes already marked it as the solution

8

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