Alignment issue with login form

I’m trying to create a login page exactly same as

There is a white space/line below the legend.
space above the check box
“Forgot your password” is not aligned center.

Here is the result page

Here is the code Edit this Fiddle - jsFiddle - Online Editor for the Web (JavaScript, MooTools, jQuery, Prototype, YUI, Glow and Dojo, HTML, CSS)

Any insight to achieve the result

desired result

Try adding

fieldset {padding:0}

to your CSS.

The “forgot password” text is centered, but in your image the form is a bit off center. See if the above CSS fixes it. For me, it’s all centered.

Thanks. padding: 0 fixed the problem. But there is space between the chkbox and “Remember my pswd”. how to fix that??

There are big top and bottom margins on the button:

.sign-btn {
  margin-bottom: 30px;
  margin-top: 20px;

Reduce those to reduce the spacing. :slight_smile:

Ralph I’m not talking about that space… there is a horizontal space between chkbox and the phrase “Remember my username”

Oh, thorry. :blush:

It’s the default margin on the input. You could change this

    margin-left: -10px;
    text-align: left;


    margin: 0 0 0 -10px;
    text-align: left;

or better (I think)

    margin: 0;
    text-align: left;