Frage Sternebewertung zentrieren

[Michel22]

Hey Leute,
Ich bastele eben an einer Sternebewertung, bei der man innerhalb von 5 Sternen auswählen kann. Das klappt bis jetzt auch sehr gut, jedoch bekomme ich es einfach nicht hin, diese Sternebewertung zu zentrieren. Ich wäre sehr dankbar dafür, wenn mir jemand helfen kann. Hier ist der html und css code:

<!-- 1. Stern -->
<span class="star" style="width:250px; margin:0px">
<span class="spacer"></span>
 <!-- 2. Stern -->
 <span class="star" style="width:200px;">
 <span class="spacer">&nbsp;</span>
  <!-- 3. Stern -->
  <span class="star" style="width:150px;">
  <span class="spacer">&nbsp;</span>
   <!-- 4. Stern -->
   <span class="star" style="width:100px;">
   <span class="spacer">&nbsp;</span>
    <!-- 5. Stern -->
    
    <span class="star" style="width:50px;">
    <span class="spacer">&nbsp;</span>
      
    <!-- 5. Stern Ende-->
    </span>
   <!-- 4. Stern Ende-->
  </span>
  <!-- 3. Stern Ende-->
 </span>
 <!-- 2. Stern Ende-->
 </span>
<!-- 1. Stern Ende-->
</span>

Css:

.star{
 height:50px;
 display:block;
 margin-left:50px;
 background:url(stern_inactive.gif) left no-repeat;
}

.active {
 background:url(stern_active.gif) left no-repeat;
}

.star:hover{
 background:url(stern_active.gif) left no-repeat;
}

.spacer{
  display:block;
 float:left;
 width:50px;
 height:50px;
}

 

[threadi]

Oder mach aus den .star "inline-block"-Elemente und zentriere diese mit einem "text-align: center" beim umgebenden Element. Dann kannst Du auch auf das floating verzichten.