How to indent text on 2nd line in list elements with icon fonts

Question

I use an icon font for list style elements:

.desc.std li:before {
  content: '\e81e';
  font-family: 'icons';
  width: .6em;
}

But when the text breaks to 2nd line, I have no text indent.

Can anyone please tell me, how I can get the 2nd and following lines indented?

Text indent only applies to the first word of each element (wich only happens in the first line). — Toni Michel Caubet, Sep 02 '13 at 15:34

score 5 · Answer 1 · answered Sep 02 '13 at 15:36

5

Here's a possible solution if applicable for your situation:

CSS

li {
    position: relative;
    padding: 0 0 0 20px;
}

li:before {
    content: '\e81e';
    position: absolute;
    left: 0px;
    font-family: 'icons';
}

Demo

Try before buy

answered Sep 02 '13 at 15:36

insertusernamehere

23,204
9
87
126

How to indent text on 2nd line in list elements with icon fonts

1 Answers1