CODEWITHSUNDEEP
htmlcsspseudo-element
Michael Kniskern
Michael Kniskern

Reputation: 25270

li::before pseudo element not being applied

I have a simple UL list that I am applying a CSS class too and the li::before pseudo class is not being applied.

HTML

<ul class="my-ul">
    <li>Item 1</li>
    <li>Item 2</li>
</ul>

CSS

.my-ul {
    font-size: 12pt;
    list-style: none;
}

.my-ul li {
    margin: 0 0 5px 0;
}

.my-ul li::before {
    content: disc;
    color: #501521;
}

What I am doing wrong?

Upvotes: 1

Views: 2005

Answers (1)

dippas
dippas

Reputation: 60573

you are probably looking for the special char u+2022

.my-ul {
  font-size: 12pt;
  list-style: none;
}

.my-ul li {
  margin: 0 0 5px 0;
}

.my-ul li::before {
  content: "\2022";
  color: red;
}
<ul class="my-ul">
  <li>Item 1</li>
  <li>Item 2</li>
</ul>

Upvotes: 3

Related Questions