Question

所以我正在关注RoR的教程，但我似乎无法正确对齐。如果我复制并粘贴教程的代码，它将看起来像 this

以下是代码：

<div class="row">
<div class="col-md-6 col-md-offset-3">
<%= form_for(@user) do |f| %>

  <%= f.label :name %>
  <%= f.text_field :name %>

  <%= f.label :email %>
  <%= f.email_field :email %>

  <%= f.label :password %>
  <%= f.password_field :password %>

  <%= f.label :password_confirmation, "Confirmation" %>
  <%= f.password_field :password_confirmation %>

  <%= f.submit "Create my account", class: "btn btn-primary" %>
<% end %>

但如果我把col-md-1，那么它有点像，this

是否仍然可以使用col-md-6但是如第二张照片那样正确对齐？我不知道除了数字之外还有什么可以改变。

Answer 1

我现在无法对此进行测试，但您可以将表单的第一行更改为：

 <%= form_for @user, :html => {:class => "form-horizontal"} do |f| %>

这应该添加html和css需要使表单水平：

 <form class="form-horizontal">

有些例子如下：https://jsfiddle.net/obp9x1yr/7/

这可能是一个很好的帖子，可以阅读更多信息：Rails Bootstrap how to format form_for (width grid collapses)

引导网格对齐问题

1 个答案: