---
id: 61add929e41980b1edbdba7e
title: Paso 81
challengeType: 0
dashedName: step-81
---

# --description--

Tu borde debería ser visible ahora. Si no se establece ningún color, el negro se utiliza por defecto.

Pero para que tu código sea más legible, es mejor establecer el color del borde explícitamente.

En la regla CSS `.sleeve`, añade la propiedad `border-left-color` con el valor `black`.

# --hints--

Tu regla CSS `.sleeve` debería tener una propiedad `border-left-color` con el valor `black`.

```js
assert(new __helpers.CSSHelp(document).getStyle('.sleeve')?.borderLeftColor === 'black');
```

# --seed--

## --seed-contents--

```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>
```

```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;
}

--fcc-editable-region--
.sleeve {
  width: 110px;
  height: 25px;
  background-color: rgba(255, 255, 255, 0.5);
  border-left-width: 10px;
  border-left-style: solid;
}
--fcc-editable-region--

.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%));
}

```
