Site logo

Archived topic

How to make bullet and underline link in widget

3 replies · Started by Eljon on July 21, 2020

Viewing posts 1–4 of 4

Hi there,

try this CSS:

.widget ul {
    list-style: none !important;
    position: relative;
    margin-left: 0 !important;  
}
.widget ul li {
    padding-left: 2em;
    padding-top: 1em;
    padding-bottom: 1em;
    border-bottom: 1px dashed #4f5a5e; 
}

.widget ul li:before {
    content: "\2756";
    position: absolute;
    top: 1em;
    left: 0;
    font-size: 22px;
    color: #4f5a5e;
}

The icon is this one:

https://www.toptal.com/designers/htmlarrows/symbols/black-diamond-minus-white-x/

You can replace the CSS unicode here: content: "\2756"; with any icon from that site.
The one your example uses is a custom icon.

Perfect, thank you David.

You're welcome

This archived topic is closed to new replies.