Results 1 to 2 of 2

Thread: display error message below input field in a form - alignment problem

  1. #1
    Join Date
    Aug 2008
    Location
    London
    Posts
    11
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Default display error message below input field in a form - alignment problem

    I would like to display an error message below an input field in a form. My css style sheet does it for the first input box but it messes formatting for the input fields below it. I am using jquery validator for validating user input. Please help!!!!!!!!!!!

    <form id="passchange" method="post" action="">
    <fieldset id="frmalign">
    <label for="password1">New password:</label>
    <input type="password" name="password1" id="password1" tabindex="0" />
    <br />
    <label for="password2">Confirm new password:</label>
    <input type="password" name="password2" id="password2" tabindex="1" />
    <label for="btn_Submit">
    <input type="submit" name="btn_Submit" class="button" id="btn_Submit" value="Save" tabindex="2"/>
    </label>
    </fieldset>
    </form>

    --------------------------------
    css for the form

    #frmalign label {
    display:block;
    float: left;
    width: 150px;
    margin-right: 5px;
    text-align: right;
    padding: 0;
    margin: 0;
    }

    #frmalign label.error{
    color:#FF0000;
    font-style: italic;
    display: none;
    width: auto;
    margin: 10px;
    }

    form {
    margin: 0;
    padding: 0;
    min-width:500px;
    max-width:650px;
    width: 560px;
    }

    form br{
    clear:left;
    }

    form fieldset {
    padding: 10px;
    margin: 0;
    }

    button {
    padding: 1px;
    }

  2. #2
    Join Date
    Mar 2007
    Location
    Currently: New York/Philadelphia
    Posts
    2,735
    Thanks
    3
    Thanked 519 Times in 507 Posts

    Default

    What's your full markup with the error?

    If you're talking about the fact that your "save" button and 2nd input field being out of alignment, add <br /> before the label of the password field.

  3. The Following User Says Thank You to Medyman For This Useful Post:

    IRG (10-27-2008)

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •