Tuesday, December 31, 2013

Custom bulleted list in CSS

Well once again I find myself scouring the internet in order to find how to add a custom image to a bulleted list in CSS. The code below is what finally worked for me.

ul.checkmark li{
   background: url("images/picture-name.png") no-repeat scroll -1px 1px rgba(0, 0, 0, 0);
   list-style-type: none;
   margin: 0;
   margin-left:-23px; padding: 0px 0px 13px 20px;
   vertical-align: middle;
}

I added a custom class, so I didn't overwright the overall default bullets.