字段有错误时无法生成内联提交按钮

Question

我有这样的问题。

我想总是提交提交和字段内联

但是当错误出现时：

以下是出现错误时的表单的html代码：

 <form accept-charset="UTF-8" action="/wibiya_users/1" class="edit_user"></div>
  <div class="field">
   <div class="field_with_errors"><input id="user_email" name="user[email]" size="30" type="text" value="email@mail.com1"></div>
  </div>
 <ul>
   <li>Email is invalid</li>
</ul>

 <div class="submit">
  <a href="#" onclick="$(this).closest('form').submit(); return false;">Edit</a>
 </div>

</form>

和这个CSS：

  .field{
  display:inline;
  }
   .submit{
  display:inline;
  }

试图补充：

    .field_with_errors{
   margin:0;
    diplay:inline;
  }

但没有帮助。

有人可以建议解决方案吗？

Answer 1

将“修改”按钮置于错误消息上方，并将float:left;应用于.field。它会奏效。

Fiddle

Answer 2

你的错误信息在你的输入和提交之间...所以当它不存在时一切都很好但是当它出现时，它会推倒它之后的元素，在这种情况下是提交按钮。