设计验证样式的问题

我在基本的Ruby on Rails应用程序中使用用户登录页面和用户注册页面的Devise gem。 我想摆脱出现错误时的丑陋默认样式。我能够用一些引导样式替换错误框，但是我找不到任何有关如何摆脱出现在我的输入和输入标签周围的丑陋红框的答案。 另外，验证发生时输入正在缩小。它们以100％的宽度开始。然后，如果出现错误，它们会缩小。这是两个问题的图像。输入框应该是一样宽，上面的.danger格：设计验证样式的问题

下面是这个页面的代码：

<div class="row"> 
<div class="top col-md-4 col-md-push-4 col-sm-6 col-sm-push-3 col-xs-10 col-xs-push-1"> 
<div class="logo_container"> 
    <%= image_tag "musilogopurple.png", class: 'logo_big' %> 
</div> 
<p class="text-center">Forget your password? Enter your email below and we will send you reset instructions.</p> 
<br /> 

<%= form_for(resource, as: resource_name, url: password_path(resource_name), html: { method: :post }) do |f| %> 
    <%= devise_error_messages! %> 

    <div class="form-group"> 
    <%= f.label :email %><br /> 
    <%= f.email_field :email, autofocus: true, class: 'form-control' %> 
    </div> 

    <div class="actions"> 
    <br /> 
    <%= f.submit "Send", class: 'btn btn-purple'%> 
    </div> 
<% end %> 

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

我将非常感谢一些指导。谢谢！

来源

2017-03-03 J Seabolt

你有脚手架吗？脚手架带来CSS文件尝试删除那些如果你不使用它。另外，如果你发布了它接收样式的CSS文件，它会有所帮助。

来源

2017-03-03 18:48:46 Gcamara14

你是非常聪明的先生！是的，问题在于我的脚手架造型。具体来说，这段代码导致了这个问题： .field_with_errors {} {padding：2px; background-color：red; display：table; } –

设计验证样式的问题

回答

相关问题