CSS-HtmlNo Comments

default thumbnail

Pseudo elements like after and before are used to add the content before or after the html element. Use the below code if you want to show font awesome icon in pseudo element.

HTML

<div class="test">

</div>

CSS

.test::before {
	content: '\f075';
	font-family:'FontAwesome';
	color: #e2e2e2;
	font-weight: bold;
	font-size: 30px;
	line-height: 54px;
	position: absolute;
	left: 15px;
	top: 0;
}

It’s urgent to link the bootstrap cdn in head section: https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css

You can check the bootstrap icon’s content values in below link: http://astronautweb.co/snippet/font-awesome-icons-v4-2/

Be the first to post a comment.

Add a comment