field_with_errors 的 CSS

dan*_*iel 5 html css ruby-on-rails

我觉得问这样一个微不足道的问题很愚蠢,但是,哦,它一直困扰着我一段时间。我有一个样式正确的表单。当用户提交时,如果有错误,表单会再次渲染,但是这一次,有错误的字段介于两者之间<div class="field_with_errors">
。我怎样才能摆脱这个空间?


<div class="field_with_errors"><input id="user_email" name="user[email]" size="30"      type="text" value=""></div>>
Run Code Online (Sandbox Code Playgroud)

这是一个完整的 HTML 示例,以便您可以确切地看到我在说什么:


<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>   
Run Code Online (Sandbox Code Playgroud)

lee*_*ers 3

试试这个:<br />从正在输出的 HTML 中删除标签,field_with_errors样式如下:

.field_with_errors {
  display: block;
  clear: both;
}
Run Code Online (Sandbox Code Playgroud)