html - Stacking fa-circle-o and other icons whilst maintaining vertical and horizontal alignment -
i'm attempting stack 2 icons. attempt looks awful, because central icon isn't centred within fa-circle-o
.
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/> <span class="fa-stack fa-lg"> <i class="fa fa-th-large fa-stack-1x"></i> <i class="fa fa-circle-o fa-stack-2x"></i> </span>
is there nice way resolve within stacking system provided font awesome?
as far know, can't solve using font-awesome classes, can simple styling applying margin-top: 1px
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/> <span class="fa-stack fa-lg"> <i class="fa fa-th-large fa-fw fa-stack-1x" style="margin-top: 1px"></i> <i class="fa fa-circle-o fa-fw fa-stack-2x"></i> </span>
Comments
Post a Comment