When using the brilliant Font Awesome, how can I make the icons not transparent - for instance if I want to use http://fortawesome.github.io/Font-Awesome/icon/chevron-circle
White background scales from a font size 1px to 150px for fa-plus-circle.
// Note: Change background color to match your criteria
// SCSS
.fa-bg-white {
position: relative;
&:before {
position: relative;
z-index: 1;
}
&:after {
position: absolute;
content: '';
background: #FFF;
border-radius: 50%;
z-index: 0;
top: 10%;
left: 10%;
width: 75%;
height: 75%;
}
}
// HTML