Dev Notes

Software Development Resources by David Egan.

Glyphicons CSS for Bootstrap 3


Bootstrap, CSS, Tools
David Egan

To add Glyphicons in CSS, use pseudo classes. For example, this code substitutes a glyphicon left chevron for the usual bullet in the .entry-content ul:

.entry-content ul {margin-left: 0; padding-left: 0;}

.entry-content ul li {
  padding: 0 0 5px 20px;
  display: block;
  position: relative;
  margin-left: 0;
}
.entry-content ul li:before {
  font-family: 'Glyphicons Halflings';
  /* font-family: FontAwesome; */
  position: absolute;
  left: 0;
  top:0;
  font-size:80%
}

.entry-content ul li:before {
 content: '\e080';
 /* content: '\f105'; // Font awesome equivalent */
}

Go here: Glyphicons Cheatsheet for Bootstrap 3

nuff said!

comments powered by Disqus