I am using a script from a website to create a rating system.
[php]fieldset{margin:auto; padding:0;}
label{margin: 0; padding: 0;}
.rating{border: none; float: left;}
.rating > input{display: none;}
.rating > label:before{margin: 5px; font-size: 1.25em; font-family: FontAwesome; display: inline-block; content: “\f005”;}
.rating > .half:before{content: “\f089”; position: absolute;}
.rating > label{color: #ddd; float: right;}
.rating > input:checked ~ label, .rating:not(:checked) > label:hover, .rating:not(:checked) > label:hover ~ label{color: #FFD700;}
.rating > input:checked + label:hover, .rating > input:checked ~ label:hover, .rating > label:hover ~ input:checked ~ label, .rating > input:checked ~ label:hover ~ label{color: #FFED85;}[/php]
[php]echo’’;
$lbl = array(“Awful”, “Pretty bad”, “Okay”, “Pretty good”, “Great”);
for($i=5;$i>=1;$i–){
if($i==$c_rate){$sel=’ checked’;}else{$sel=’’;}
echo’<input class=“stars” type=“radio” id=“star’.$i.’” name=“rating” value="’.$i.’"’.$sel.’ />’;
echo’’;
}
echo’’;[/php]
If the float:left is removed from .rating, the whole thing moves to right. If float:right is removed from .rating > label, the stars are highlighted in reverse order. If I reverse the for loop, the stars end up being backwards.
Any ideas?