Is the indentation torn when using a special bullet

Question

I am trying to align the lines with the lighters when using a custom marker point, however, any negative text indentation that I found on the Internet did not work if I did not miss something.

Can anyone take a look at the code below and tell me what I need to add to the indentation lines with lighters?

.list-icon-pros {
    list-style: none;
    padding-left: 0;
}
.list-icon-pros li:before {    
    font-family: FontAwesome;
    color: #B3B300;
    padding-right: 10px;
    content: "\f00c";
}

Answer 1

You can add a negative margin to the pseudo-element or use it position: absolute.

Absolute Position: http://jsfiddle.net/ZwYyL/6/

.list-icon-pros {
    list-style: none;
    padding-left: 20px;
    position: relative;
}
.list-icon-pros li:before {
    font-family: FontAwesome;
    color: #B3B300;
    content:"\f00c";
    position: absolute;
    left: 0;
}

Negative field: http://jsfiddle.net/ZwYyL/5/

.list-icon-pros {
    list-style: none;
    padding-left: 22px;
}
.list-icon-pros li:before {
    font-family: FontAwesome;
    color: #B3B300;
    content:"\f00c";
    margin:0 5px 0 -22px;
}