问题描述
使用 formtastic，我有一个数量字段和单位字段，用于询问商品的数量和计量单位.
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.
我的问题是，我希望单位框与数量框一起显示.但是，因为 formtastic 将每个输入都放在它自己的 LI 元素中，所以我无法让它们彼此相邻出现.
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.
有什么想法吗?
推荐答案
为您的数量和单位字段使用 html 包装器:
Use an html wrapper for your quantity and unit fields:
<%= form.input :quantity, :wrapper_html => { :class => 'fl' } %>
<%= form.input :unit, :wrapper_html => { :class => 'fl' } %>
在你的 css(可能是 formtastic-changes.css)中，一个 css 浮动属性来浮动 li.我添加了一点右边距，给单位标签一些喘息的空间:
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;}
您可能需要为 wrapper_html 设置特定的类或 ID，并调整 css 以使您的布局和间距按照您想要的方式工作.
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.
这篇关于在 Formtastic 的同一个 LI 元素中包含两个输入的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！