Menu
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>
346
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;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
