在标签和字段之间添加空格

在我的Rails应用中，登录页面上字段的标签太靠近字段本身，使它看起来局促。我想增加他们之间的空间，但我不知道如何。在标签和字段之间添加空格

enter image description here

我有导轨4与simple_form，自举3，并设计安装。

这是我的app/views/devise/sessions/new.html.erb代码：

<div class="row"> 
<div class="col-xs-4"> 
<%= simple_form_for(resource, as: resource_name, url: session_path(resource_name), html: {class: "well"}) do |f| %> 

<fieldset> 
    <legend>Log in</legend> 
<%= f.input :email %> 
<%= f.input :password %> 

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

</fieldset> 
    <% end -%> 

    <div class="actions"> 
    <%= f.button :submit, "Log in" %> 
    </div> 
<% end %> 

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

<div class="col-xs-8"> 
    <h2>Signing in is easy and secure</h2> 
</div> 
</div>

这里是整个GitHub库：https://github.com/yamilethmedina/wheels_registration

我一直在找我的bootstrap.css文件，无法找到相关的类。你觉得我应该接下来做什么？

来源

2015-05-04 Yami Medina

您可以在自定义标签后添加自己的标签和空格。

<%= f.input :email, label: 'Email ' %> 
<%= f.input :password, label: 'Password ' %>

或者你可以使用像chrome dev tools工具来检查标签元素，看看有什么class标签给出然后添加一些自定义CSS。示例.label-class { margin-right: 10px; }

来源

2015-05-04 17:03:14

即使在重新启动服务器后，第一种方法也无法工作（在两个单独的浏览器上）。当我检查元素时，它被称为'label.email.optional'，例如，我无法在任何css文件中找到它。 –

它不在css文件中，因为'simple_form'会自动创建它。您需要添加'label.email，label.password {margin-right：10px; }'在一个css文件 –

你有没有得到它的工作？ –

在标签和字段之间添加空格

回答

相关问题