html - Bootstrap表单样式将不适用

好的，这是我的.html.erb文件。如您所见，我应用了仅margin-fix的margin-bottom: 10px;类，问题是这将不适用。

现在，下面有一个带有类sign_in_button的按钮，所有样式都可以正常工作，但不适用于该字段。它们是局促在一起的方式，需要一定的余量，但这根本行不通。所有css都应用在application.css中。我什至尝试了一个custom.css，它可以很好地加载，但没有将样式仅应用于表单。我正在使用几天前刚刚安装的最新的rails下载。

<div class="container">
  <div class="row">
    <div class="col-md-4 well sign_in">
      <%= simple_form_for(resource, :as => resource_name, :url =>
session_path(resource_name)) do |f| %>

      <fieldset>
        <legend>Sign In</legend>

      <%= f.input :email, :class => 'margin_fix' %>
      <%= f.input :password %>

      <% if devise_mapping.rememberable? -%>
      <div><%= f.input :remember_me, as: :boolean %> </div>
      <% end -%>

      <div><%= f.submit "Sign In", :class => 'sign_in_button' %></div>
    </fieldset>
      <% end %>

      <%= render "devise/shared/links" %>
    </div>
    <div class="col-md-8">
      <h2>Signing in is easy and secure</h2>
    </div>
  </div>
</div>

最佳答案

除了可能的拼写错误：您没有使用推荐的Bootstrap 3（显然您正在使用）格式化。您应该使用form-group-和form-control-类。将您的字段集替换为：

<fieldset>
  <legend>Sign In</legend>

  <div class="form-group margin_fix">
    <%= f.input :email, :class => 'form-control' %>
  </div>
  <div class="form-group">
    <%= f.input :password, :class => 'form-control' %>
  </div>

  <% if devise_mapping.rememberable? -%>
    <div class="form-group">
      <%= f.input :remember_me, :class => 'form-control', as: :boolean %>
    </div>
  <% end -%>
  <div>
    <%= f.submit "Sign In", :class => 'sign_in_button' %>
  </div>
</fieldset>

如果这不起作用，请发布margin_fix -class的定义。

关于html - Bootstrap表单样式将不适用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/19958323/