views:

435

answers:

1

Using formtastic, I have a quantity field and unit field that asks for the quantity of the item and the unit it's measured in.

My problem, is that I would like the unit box to display along side the quantity box. However, because formtastic pust each input in it's own LI element, I can't get them to appear next to each other.

Any ideas?

+4  A: 

Use an html wrapper for your quantity and unit fields:

<%= form.input :quantity,   :wrapper_html => { :class => 'fl' } %>
<%= form.input :unit,       :wrapper_html => { :class => 'fl' } %>

And in your css (probably formtastic-changes.css), a css float property to float the li. I've added a bit of right margin to give the unit label some room to breathe:

form.formtastic fieldset ol li.fl {float: left; margin-right: 2em;}

You may have to have specific classes or ids for the wrapper_html and fiddle with the css to get your layout and spacing working the way you'd like.

ghoppe
Answer accepted because it showed me that nothing else would work. I simply intermixed regular form builder syntax in.
WedTM
Thanks, but I don't understand why you'd need to use regular form builder? I'm using this wrapper_html technique successfully with formtastic (using display:inline in my css instead of float) and it's working fine.
ghoppe
I also do this. It works fine.
jonnii