Czarnodziej
Czarnodziej

Reputation: 53

Font-awesome class with multiple different icons

I want to create custom font-awesome class with multiple icons in it, i.e. .2star class consisting of 2 stars and 3 empty stars in a line, beside each other. Is there a way to do it in CSS or I have to use html-only solution with multiple i-classes ?

Upvotes: 4

Views: 4450

Answers (1)

Mr. Alien
Mr. Alien

Reputation: 157314

Yes you create a custom font awesome class, with multiple characters in content like this

.class:after {
   content: "\f005\f005\f005"; /* 3 Stars */
    font-family: FontAwesome;
}

Demo

Note that the values like \f005 etc can be found in FontAwesome stylesheet so copy the unicode of the type of font you like and use it in the content property with the font family of Font Awesome.

Upvotes: 10

Related Questions