CODEWITHSUNDEEP
csshtml-lists
Adam M
Adam M

Reputation: 11

css li icon gives double char

I can't figure out how to change the icon on the li in this url.

I tried to change the content but that just gave an extra figure over the green v.

https://codepen.io/gnevin/pen/axNVex

.check-list {
  margin: 0;
  padding-left: 1.2rem;
}

.check-list li {
  position: relative;
  list-style-type: none;
  padding-left: 2.5rem;
  margin-bottom: 0.5rem;
}

.check-list li:before {
    content: ' ';
    display: block;
    position: absolute;
    left: 0;
    top: -2px;
    width: 5px;
    height: 11px;
    border-width: 0 2px 2px 0;
    border-style: solid;
    border-color: #00a8a8;
    transform-origin: bottom left;
    transform: rotate(45deg);
}

Upvotes: 1

Views: 24

Answers (1)

Musfiq Shanta
Musfiq Shanta

Reputation: 1615

Here use border and transform used for rotation. If you want to change there are a few more ways. First of all, remove the border and put what you want in the content.And use List style for default styling

enter image description herek.imgur.com/gwikL.png

Upvotes: 1

Related Questions