Rails Bootstrap如何格式化form_for(宽度网格折叠)
我正在尝试用bootstrap-sass创建一个表单。 我需要找到引导类的最佳配置,使其看起来不错。 它没有以我期望的方式显示,特别是当浏览器宽度小于特定大小时,标签和表单字段之间的空格会崩溃,并且它看起来不再好看。 如果它只发生在小宽度上就可以了,但事实并非如此。 我真的很感激这方面的一些帮助,真的,用bootstrap格式化form-horizontal
的最佳方法是什么?
这是我的代码:
从注释掉的代码中可以看出,我首先使用了form-group
类,但它运行不正常。 同样,问题是当浏览器的宽度小于特定大小时,标签和文本字段之间的空格会崩溃。 右对齐的标签会失去对齐。 浏览器必须几乎全屏才能正确显示,这是不对的,因为它有足够的空间可以在较小的宽度上正确显示。 我正在关注本指南http://getbootstrap.com/css/#grid
编辑 :在代码中添加了电子邮件字段,因为它的大小不同,更容易看到问题。
您应该查看http://getbootstrap.com/css/#forms-horizontal并且您不需要添加form tag
因为您已经在使用form_for
<%= form_for @user, :html => {:class => "form-horizontal center"} do |f| %> <%= f.label :fname, "First name:", class: "col-md-4 control-label" %> <%= f.text_field :fname, class: "form-control" %> <%= f.label :lname, "Last name:", class: "col-md-4 control-label" %> <%= f.text_field :lname, class: "form-control" %> <%= f.label :comments, "Comments:", class: "col-md-4 control-label" %> <%= f.radio_button :attend, 'yes', :checked => true %> I will attend.
<%= f.radio_button :attend, 'no', :checked => false %> I will not attend. <%= f.check_box :workshop %> Checkbox Description <%= f.submit "Submit", class: "btn btn-default btn-primary" %> <% end %>