Estoy usando RoR y estoy usando la gema Simple_Form para mis formularios. Tengo una relación de objeto por la cual un usuario puede tener múltiples roles, y durante la creación, el administrador puede seleccionar qué roles aplicar al nuevo usuario. Me gustaría que los roles tengan su casilla de verificación a la izquierda y su nombre a la derecha en una disposición horizontal.

// "caja" Admin //

en lugar de la corriente

//

"caja"

Administración

//

Mi código actual para mostrar los roles es este.

  <div class="control-group">
    <%= f.label 'Roles' %>
    <div class="controls">
      <%= f.collection_check_boxes 
                 :role_ids, Role.all, :id, :name %>
    </div>
  </div>

La parte en la que más me estoy quedando colgado es el hecho de que f.collection_check_boxes genera código como este.

<span>
  <input blah blah />
  <label class="collection_check_boxes" blah>blah</label>
</span>

Lo que me dificulta obtener una clase css allí, ya que hay 3 componentes que deben ser tocados. He intentado agregar cosas como clases ficticias al hash html, pero la clase ficticia ni siquiera aparece en el html representado.

Cualquier ayuda es muy apreciada

EDITAR: Solución

Gracias a Baldrick, mi trabajo erb se ve así.

<%= f.collection_check_boxes :role_ids, Role.all, :id, :name,
      {:item_wrapper_class => 'checkbox_container'} %>

Y mi CSS es el siguiente

.checkbox_container {
  display: inline-block;
  vertical-align: -1px;
  margin: 5px;
 }
.checkbox_container input {
  display: inline;
 }
.checkbox_container .collection_check_boxes{
  display: inline;
  vertical-align: -5px;
 }