Question

好的，这是我的.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>

Answer 1

你提到'margin-fix'（带连字符）类，但在上面的ERB中，类被称为'margin_fix'（带下划线）。

ERB和CSS文件中的类是否相同？

Answer 2

除了可能的拼写错误：您没有使用推荐的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 - 类的定义。

Answer 3

我删除了所有公共/资源文件并更改了

config.assets.debug = true

要

config.assets.debug = false

现在它似乎工作得很好。

Bootstrap表单样式不适用

3 个答案: