I am using font awesome on some project but I have some things that I want to do with font awesome icons, I can easily call an icon like this:
<i class="fa fa-lock"></i>
Is it possible to all icon always be in round circle with border? Something like this, I have a picture:
Using
i {
background-color: white;
border-radius: 50%;
border: 1px solid grey;
padding: 10px;
}
Will do the effect, but the problem is that icons are always bigger that the text or element beside, any solutions?
Best Answer
With Font Awesome you can easily use stacked icons like this:
refer Font Awesome Stacked Icons
Update:- Fiddle for stacked icons