Ruby on Rails中的Devise&Bootstrap复选框:如何修复margin-left的自动设置:-20px?

时间:2022-11-03 00:20:56

I'm working on stylizing the Devise sign-in form (app/devise/sessions/new.html.erb) with Bootstrap (using Ruby 2.0.0 and Rails 4.0), and have set the checkbox for "Remember Me" as such:

我正在使用Bootstrap(使用Ruby 2.0.0和Rails 4.0)设计Devise登录表单(app / devise / sessions / new.html.erb),并设置了“记住我”的复选框。 :

  <div class="form-group">
    <div class="checkbox">
      <%= f.check_box :remember_me %>
      <%= f.label :remember_me %>
    </div>
  </div>

But for whatever reason, I think Bootstrap keeps automatically setting it so the checkbox-inline has a margin-left of -20px, because it shows this when I examine the element using Google Chrome's developer tools. In the browser I can change this setting to 0px and it fixes the problem, but I have no idea how to actually do this in my Rails application with either Bootstrap's CSS.SCSS customization file or any other method.

但无论出于何种原因,我认为Bootstrap会自动设置它,因此复选框内联的边距为-20px左边,因为当我使用谷歌Chrome的开发人员工具检查元素时它显示了这一点。在浏览器中,我可以将此设置更改为0px并修复问题,但我不知道如何在我的Rails应用程序中使用Bootstrap的CSS.SCSS自定义文件或任何其他方法实际执行此操作。

Does anyone know a possible fix for this? Thank you to all in advance.

有谁知道可能的解决方案吗?谢谢大家提前。

1 个解决方案

#1


0  

If you have an override css file you can override the class within there. Display: inline; should fix it. I highly recommend using Chrome Dev tools to play around and then paste the css into your overrides file.

如果你有一个覆盖css文件,你可以覆盖那里的类。显示:内联;应该解决它。我强烈建议您使用Chrome Dev工具进行播放,然后将css粘贴到您的覆盖文件中。

My typical overrides file lives in assets/stylesheets and is called framework_and_overrides.css.scss

我的典型覆盖文件位于assets / stylesheets中,称为framework_and_overrides.css.scss

#1


0  

If you have an override css file you can override the class within there. Display: inline; should fix it. I highly recommend using Chrome Dev tools to play around and then paste the css into your overrides file.

如果你有一个覆盖css文件,你可以覆盖那里的类。显示:内联;应该解决它。我强烈建议您使用Chrome Dev工具进行播放,然后将css粘贴到您的覆盖文件中。

My typical overrides file lives in assets/stylesheets and is called framework_and_overrides.css.scss

我的典型覆盖文件位于assets / stylesheets中,称为framework_and_overrides.css.scss