Question

I have such problem.

I want to make submit and field inline always

but when errors appears its turn to:

Here is html code of form when error appears:

 <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="[e-mail]1"></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>

and this CSS:

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

Tried to add:

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

but didn’t help.

Can someone suggest solution ?

Answer 1

Place your Edit button above error message, and apply float:left; to .field . And it will work.

Fiddle