Menu
What is the proper markup for using a button with only a glyphicon in it in Twitter Bootstrap 3.0? If I use the following
<button type="button" class="btn btn-xs btn-danger"> <span class="glyphicon glyphicon-trash"></span> </button> I get something like this:
Update:
I did a diff between the styles on mine and @Adrift's <button> element and got the following:
# -- is mine --webkit-perspective-origin: 12px 8px; +-webkit-perspective-origin: 12px 11px; --webkit-transform-origin: 12px 8px; +-webkit-transform-origin: 12px 11px; -height: 16px; +height: 22px; -text-rendering: auto; +text-rendering: optimizelegibility; 
787
Free Alternatives to Glyphicons You can use both Font Awesome and Github Octicons as a free alternative for Glyphicons.
Glyphicons. Bootstrap includes 260 glyphs from the Glyphicon Halflings set. Glyphicons Halflings are normally not available for free, but their creator has made them available for Bootstrap free of cost. As a thank you, you should include a link back to Glyphicons whenever possible.
You will have to buy the PRO version if you want to use it without bootstrap.
In lines 15 and 17 the <span> and <a> element has the bootstrap glyphicon glyphicon-pencil classes, so to use any glyphicon in bootstrap: Use the <span> or <a> element. Set the class attribute of the <span> or <a> element as glyphicon then a space and then glyphicon-iconname.
Try adding a non-breaking space after the icon span.
Like this:
<button type="button" class="btn btn-xs btn-danger"> <span class="glyphicon glyphicon-trash"></span> </button> If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
