CSS for star ratings via FontAwesome

Question

I\'ve tried a few variations of CSS star ratings via different methods, and am trying to implement the following via FontAwesome rather than using a sprite. I want to be abl

Answer 1

I find myself doing with two sets of stars styles solid and regular. Solid set declared first to have higher z-index and overlapped Regular sets of stars controlled by hidden, nowrap and width.

.stars-rating {
	position: relative;
    display: inline-block;
}

.stars-rating .stars-score {
              position: absolute;
              top: 0;
              left: 0;
              overflow: hidden;
              width: 20%;
              white-space: nowrap;
}