Home/ Questions/Q 3337808
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-18T00:17:51+00:00

I feel silly asking such a trivial question but, oh well, it’s been bugging

  • 0

I feel silly asking such a trivial question but, oh well, it’s been bugging me for a while.
I have a form that’s properly styled. When the user submits, if there is errors, the form will render again, but this time, the fields that have errors are but in between a <div class="field_with_errors">
Know the problem is this creates an extra space after the text, notice the extra space after Contrasena. How can I get rid of this space?


<div class="field_with_errors"><input id="user_email" name="user[email]" size="30"      type="text" value=""></div>>

Here is a full HTML example, so that you can see exactly what I am talking:


<html><head>
    <title>foo</title>
  </head>
  <body>
    <header>
    </header>
    <section class="container">
      <div class="formbox">
        <h1>Registrarse</h1>
        <form accept-charset="UTF-8" action="/users" class="new_user" id="new_user" method="post"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="✓"><input name="authenticity_token" type="hidden" value="nP/JKdZYGviu1y/+nyxyvKBUHuJzsAbkZRQgX87UIy8="></div>
          <!-- = render 'shared/error_messages', :object => f.object -->
          <div class="text">

<label for="user_email">Email</label>
            <br>
            <div class="field_with_errors"><input id="user_email" name="user[email]" size="30" type="text" value=""></div>
          </div>
          <div class="text">
            <div class="field_with_errors"><label for="user_password">Contrasena</label></div>
            <br>
            <div class="field_with_errors"><input id="user_password" name="user[password]" size="30" type="password" value=""></div>
          </div>
          <div class="text">
            <label for="user_password_confirmation">Confirmacion</label>
            <br>
            <input id="user_password_confirmation" name="user[password_confirmation]" size="30" type="password" value="">
          </div>
          <div class="actions">
            <input class="button_green" id="user_submit" name="commit" type="submit" value="Registrarse">
          </div>
        </form>
      </div>
    </section>
    <footer>
    </footer>

</body></html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Try this: Remove the <br /> tags from the HTML that’s being output and style field_with_errors like this:

    .field_with_errors {
  display: block;
  clear: both;
}
    • 0