移动输入框的简单表单错误消息

Question

我遇到了使用simple_form gem在我的“注册”表单上格式化错误消息的问题。 This is what my registration form looks like when handling errors.

我希望错误消息出现在输入框下方，并且我不希望输入框的对齐方式在提交错误输入时发生更改。

 <%= simple_form_for(resource, as: resource_name, url: registration_path(resource_name)) do |f| %> 
     <%= f.error_notification input_html: { class: 'error' } %> 
     <div class="panel-body"> 
      <%= f.input :email, required: true, autofocus: true, label: false, placeholder: 'Email', input_html: { class: 'input-lg' } %> 
      <%= f.input :user_name, required: true, label: false, placeholder: 'User Name', input_html: { class: 'input-lg' } %> 
      <%= f.input :password, required: true, label: false, placeholder: 'Password', input_html: { class: 'input-lg' } %> 
      <%= f.input :password_confirmation, required: true, label: false, placeholder: 'Confirm Password', input_html: { class: 'input-lg' } %> 

有什么我可以在我的CSS调整，使错误信息出现在下面的输入框中中心：如看到下面的输入和错误消息的结构？我尝试过利用边缘，但是当我这样做时，输入框会改变对齐方式。

Answer 1

找到了解决方案，它非常简单。刚刚不得不编辑CSS如下：

.error { 
    display: block; 
    text-align: center; 
}