lists - font awesome

by conbow

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/3.2.1/css/font-awesome.min.css">
<ul class="icons-ul">
  <li><i class="icon-li icon-ok"></i>Bulleted lists (like this one)</li>
  <li><i class="icon-li icon-ok"></i>Buttons</li>
  <li><i class="icon-li icon-ok"></i>Button groups</li>
  <li><i class="icon-li icon-ok"></i>Navigation</li>
  <li><i class="icon-li icon-ok"></i>Prepended form inputs</li>
  <li><i class="icon-li icon-ok"></i>&hellip;and many more with custom CSS</li>
</ul>

CSS

body {
  font-size: 20px;
}
.icons-ul{  
    width:100px;
}

.icons-ul>li {
position: relative;
}

icons-ul {
margin-left: 2.142857142857143em;
list-style-type: none;
}

ul, ol {
margin-top: 0;
margin-bottom: 10px;
}

.icons-ul .icon-li {
position: absolute;
left: -2.142857142857143em;
width: 2.142857142857143em;
text-align: center;
line-height: inherit;
}

[class^="icon-"], [class*=" icon-"] {
display: inline;
width: auto;
height: auto;
line-height: normal;
vertical-align: baseline;
background-image: none;
background-position: 0% 0%;
background-repeat: repeat;
margin-top: 0;
}