[Brandon]

I had to do this for a recent project guys, if you want to try its pretty cool, for example you don’t want to basic bullet discs or ordered list numbers, you want something custom like “Step 1, Step 2, etc” you can use this.

ol > li:before {  
    margin-right: 10px;
    padding: 2px 10px;
    content:"Step " counter(list-item)" ";
    counter-increment: index;
    background-color: yellow;
}

ol li:first-child {
    counter-reset: index;
}

ol li {
    list-style-type: none;
}

[Henry]

Technically this is not actually using the “marker” pseudo class

cuz it doesn’t support background colors

[Heather]

https://stackoverflow.com/questions/23552988/add-background-color-to-list-item-bullet

[Amber]

alt

https://stackoverflow.com/questions/31438731/html-ol-list-style-background-color

[Peter]

verry nice, high five!!

[Author]

Posts