Font-awesome class with multiple different icons

Question

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 ?

Answer 1

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.