JQuery validation formatting Problem in IE

In firefox, error messages are displayed as expected. To the right of the item being checked. In IE. No matter what I do with the size of the labels / elements / errors, the error is always displayed below the element, causing every other element to be pushed down.

<p>
   <label for="handle"><strong>User Name</strong></label>
   <INPUT NAME="handle" id="handle" VALUE="#attributes.getUser.handle#">
</p>                
<p>
   <label for="password"><strong>Password</strong></label>
   <INPUT TYPE="TEXT" id="password" NAME="password"
          MAXLENGTH=50 VALUE="#attributes.getUser.password#">
</p>

<p>
    <label for="confirmPassword"><strong>Confirm Password</strong></label>
    <INPUT TYPE="TEXT" id="confirmPassword" NAME="confirmPassword"
           MAXLENGTH=50 VALUE="#attributes.getUser.password#">
</p>

      

If anyone else had this problem, I would really appreciate any help.

0


source to share


3 answers


I had the style "margin-bottom: 16px" set on these input elements.

Removing this (after a few hours of trial, error and searching) fixed the issue.



Hope someone saves the watch .; ^)

0


source


Have you tried closing <input> elements ?



0


source


If you haven't already, you can verify that the page is XHTML valid (I'm using the HTML Validator ). This should ensure that all of your elements are properly closed and nested.

Also, have you tried using CSS positioning for elements, for example to adjust the display in line?

Without seeing the code, it's hard to tell. If it's a positioning issue, Firebug is usually very helpful.

0


source







All Articles