Question

在formtastic中，当创建语义形式时，默认情况下，对象属性的布局始终列为垂直（一个属性标签和值占据一行）。

如何自定义布局，以便部分属性可以处于 horizental 位置。例如，我希望“body”属性位于“title”的右侧侧。怎么做？

<% semantic_form_for @post do |form| %>
    <% form.inputs do %>
      <%= form.input :title %>
      <%= form.input :body %>
      <%= form.input :section, :as => :radio %>
      ...

Answer 1

Formtastic在包装器class和其他位置提供了大量HTML id和<li>挂钩，以便您可以一般地设置不同的类型输入（例如{ {1}}）或具体输入方式不同（例如li.string）。

正如其他提到的答案一样，您可以使用li#user_email_input向包装器添加额外的类，以便在上述选项不适合时为自己提供新的挂钩。

从这里开始，它纯粹是一个样式/ CSS问题。您可能希望使用:wrapper_html => { :class => 'whatever' }将<li>包装器相互浮动，然后使用float:left;清除包含<ol>的浮动或您喜欢的任何其他清除技术。< / p>

Answer 2

您可以使用CSS完成此任务：

<%= form.input :title, :wrapper_html => {:class => "left"} %>

然后在你的样式表中：

.left
{
  float: left;
  /* etc. */
}

这将设置表单元素的容器样式（默认为li）

Answer 3

您必须更改CSS。但是，如果您需要针对特定属性进行布局自定义，我建议您自己构建表单元素。

形式语义形式布局问题

3 个答案: