Home » Web » HTML & CSS » Bootstrap Glyphicons not Displaying

Bootstrap Glyphicons not Displaying

Reason behind the post…

I was going through stack-overflow searching for my similar problem.  I had just downloaded the new Bootstrap 3.0 framework and was building a theme.  I came to a point where I wanted to use a glyphicon and here is what I used in my code:

[cce lang=”html”] Follow[/cce] Long story short, I spent at least 10-15 minutes making sure that I had grabbed the proper files and that they were correctly placed in my css and pointing to the right locations.  This was however, not the case.  The fix was most simple and the very apparent once I realized my mistake.  I was now using Bootstrap 3.0 and no longer > 3.0.  Here is how you now call glyphicons:  *Note you not only now use span but you also call the icons with glyphicon and then the specific icon, in this case, glyphicon-plus.*

In Bootstrap 3.0, no longer are the i or icon classes used. The icons are now displayed with span. An example given on the Bootstrap 3.0 website is this one:

[cce lang=”html”]<button type=”button” class=”btn btn-default btn-lg”>

<span class=”glyphicon glyphicon-star”></span> Star

</button>[/cce]

 

Hopefully this helps a few of you out in the future when transitioning from Bootstrap 2.x to 3.0! To further aid you in your transformation from 2.x to 3.0 here is a list of significant changes:  Bootstrap Migration

Leave a Reply

file not found1223