Skip to content

Instantly share code, notes, and snippets.

@hubgit

hubgit/glyphicon-spacing.css

Last active January 10, 2019 11:18
Show Gist options
  • Star 8 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save hubgit/6102605 to your computer and use it in GitHub Desktop.
Save hubgit/6102605 to your computer and use it in GitHub Desktop.
Download ZIP
Spacing for Bootstrap Glyphicons in buttons
Raw
glyphicon-spacing.css
.btn .glyphicon {
margin-right: 4px;
vertical-align: middle;
}
.btn.btn-icon .glyphicon {
margin-right: 0;
}
@rex
Copy link

rex commented Mar 3, 2014

I scoured the internet for an hour trying to find a way to make the stupid glyphicons move over, and here you are. You rock my damn socks.

I did have to make a few changes to get it to suit my needs on Bootstrap 3.1.1, here is what worked for me:

.btn .glyphicon {
  margin-right: 8px;
}

.btn.btn-icon .glyphicon {
  margin-right: 0;
}

I love you, @hubgit. It's the forever kind.

@Quix0r
Copy link

Quix0r commented Apr 16, 2018

The .glyphicon-folder-open has no spacing to the right (e.g. when you have a link with an icon left and text right). Then you may need this:

a .glyphicon-folder-open {
    margin-right: 2px;
}

Replace a with e.g. .btn when you need to assign it to it.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment