How to indent the text in a custom unordered list

Question

Fiddle: http://jsfiddle.net/pgf0ckfj/1/

CSS:

ul {
    list-style: none;
    padding: 0 0 0 45px;
}
ul li:before {
    content: \"♦ \";
    color: #E5         


        

Answer 1

Add text-indent attribute.

ul {
  text-indent: -20px;
  /* add text-indent */
  list-style: none;
}
ul li:before {
  content: "♦ ";
  color: #E55302;
}

  
This is the first entry but only goes one line
  
This is the second entry but only goes one line
  
This is the third entry but it can go many many many lines and sometimes even a whole paragraph and I would like the text to be indented from the bullet.
  
This is the fourth entry but only goes one line
  
This is the third entry but it can go many many many lines and sometimes even a whole paragraph and I would like the text to be indented from the bullet.