Simple_form 文本框非常长答案

【问题标题】：Simple_form text boxes are extremely longSimple_form 文本框非常长
【发布时间】：2015-04-30 21:53:11
【问题描述】：

使用 simple_form 和 bootstrap，我无法正确调整输入框的大小。它们是不同的，过长的，长度。我可以在 CSS 中对它们进行硬编码，但是它们没有响应。（我尝试了 max-width，但它们最终是固定宽度。）还使用设计 gem 进行用户身份验证。

页面代码：

<div class="booyah-box col-xs-10 col-xs-offset-1">
<h2>Sign up</h2>

<%= simple_form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %>
  <%= f.error_notification %>

  <div class="form-inputs">
    <%= f.input :email, required: true, autofocus: true %>
    <%= f.input :password, required: true, hint: ("#{@minimum_password_length} characters minimum" if @validatable) %>
    <%= f.input :password_confirmation, required: true %>
  </div>

  <div class="form-actions">
    <%= f.button :submit, "Sign in", :class => 'btn btn-primary' %>
  </div>
<% end %>

<%= render "devise/shared/links" %>
</div>

【问题讨论】：

请在此处粘贴代码。
您可能想使用 Google Chrome 的开发工具来查看哪些 CSS 规则被应用于文本框。看起来您的 CSS 在某处损坏了。
上面粘贴的代码。目前，这些输入的标准 bootstrap/simple_form 之外没有特定的 CSS。我遇到了一个问题，我在添加 simple_form gem 之前生成了设计视图，所以我不得不返回并在之后重新生成设计视图。
对不起，这实际上不是真的。这是代码所在的“booyah-box”类的 CSS：.booyah-box { -moz-box-shadow: 1px 1px 2px 0 #d0d0d0; -webkit-box-shadow: 1px 1px 2px 0 #d0d0d0; box-shadow: 1px 1px 2px 0 #d0d0d0; background: #fff; border: 1px solid #ccc; border-color: #e4e4e4 #bebebd #bebebd #e4e4e4; padding:10px; } .booyah-box h2, .booyah-box h1 { margin:10px; }

标签： ruby-on-rails devise simple-form

【解决方案1】：

<div class="row">
<h2>Sign up</h2>
<div class="col-lg-8 col-md-4 col-sm-12 col-xs-12">
<%= simple_form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %>
  <%= f.error_notification %>

  <div class="form-group">
    <%= f.input :email, required: true, autofocus: true, class: "form-control" %>

   // you can add class **col-lg-6** in any input field for maintaining the width

    <%= f.input :password, required: true, hint: ("#{@minimum_password_length} characters minimum" if @validatable), class: "form-control" %>
    <%= f.input :password_confirmation, required: true, class: "form-control" %>
  </div>

  <div class="form-group">
    <%= f.button :submit, "Sign in", :class => 'btn btn-primary' %>
  </div>
<% end %>

<%= render "devise/shared/links" %>
</div>
</div>

【讨论】：

谢谢鸸鹋。原来服务器重启解决了问题。