CSS: Using Font Awesome Icon for Bullet Points

Submitted by admin on Sun, 04/10/2016 - 14:21

li:before {
position: absolute;
top: 0;
left: 0;
font-family: 'FontAwesome'; /* Specify FontAwesome */
content: '\f07b'; /* This is a folder icon */
color: #fab100; /* Yellow */
}

li {
position: relative; /* Line breaks without this */
padding-left: 20px; /* Add a padding for the size of Fontawesome icon */
/* at the left of the bullet item */
list-style-type: none; /* Display bullet dot(・)without this */
}

Tags