ruby-on-rails - 如何在 Ruby on Rails 中调整 <%= form_for %> 表单的输入大小

Question

如果我试图减小“电子邮件”和“密码”表单的宽度：

    <div id="signin">
    <h1>Sign in</h1>

    <%= form_for(:session, :url => sessions_path) do |f| %>
      <div class="field">
        <%= f.label :email %><br />
        <%= f.text_field :email %>
      </div>
      <div class="field">
        <%= f.label :password %><br />
        <%= f.password_field :password %>
      </div>
      <div class="actions">
        <%= f.submit "Sign in" %>
      </div>
     <% end %>

...并将它们放在右上角的导航栏中，CSS 看起来如何？

为什么会....

    #signin #field.text_field {

    width:20px;

    }

...不行？

谢谢。

Answer 1

Rails 的.text_field方法将input在您的 HTML 中生成一个标签，因此您需要改为以该input标签为目标。此外，您应该使用.field, not #field，因为它是一个类，而不是一个 id。

#signin .field input {
  width:20px;
}

Answer 2

试试这个：field被定义为类但不是一个ID。

#signin .field.text_field { width: 20px; }

或者

我认为您可以将第 6 行修改为

<%= f.text_field :email, :size => 10 %>