Question

So i’m trying to make a login box with 2 fields and a submit button. The submit button position itself differently in EVERY browser. In Firefox it works as expected but in IE8 and Safari the vertical alignment gets screwed up. Any ideas to resolve this problem?

Here’s a screendump of the issue: http://gefuhlkunder.dk/bla.jpg

    <form action="">
                <div>
                     <input type="text" name="brugernavn" class="login-input" value="Brugernavn" />
                     <input type="text" name="brugernavn" class="login-input" value="password"  />

                     <input class="login-submit" type="submit" value="login" />
             </div>
             </form>

.login-input{

        border:1px solid #bebebe;
        font-family: 'FlamaBook', sans-serif;
        font-size:10px;
        letter-spacing:-0.4px;
        text-transform:uppercase;
        color:#464646;
        font-size-adjust: 0.5;

        height:18px;
        line-height:18px;
        text-align:center;
        width:69px;
        margin:0 3px 0  0;

}


.login-submit{


        border:1px solid #bebebe;
        font-family: 'FlamaBook', sans-serif;
        font-size:10px;
        letter-spacing:-0.4px;
        text-transform:uppercase;
        color:#464646;
        font-size-adjust: 0.5;

        text-align:left;
        position:absolute;
        padding: 0px 0px 0 3px;
        width:59px;
        height:20px;
        line-height:20px;
        background:#fff url(images/submit_bg.png);
        cursor:pointer;



}

Answer 1

Try these

.login {
    font-family: sans-serif;
    font-size:10px;
    border:1px solid #bebebe;
    text-transform:uppercase;
    text-align:center;
    color:#464646;
    cursor:pointer;
    padding:3px;
    margin-right:3px;
}
.login-submit {
    margin-top:3px; 
}

and

<form action="">
<div>
    <input type="text" name="brugernavn" class="login login-input" value="Brugernavn" />
    <input type="text" name="brugernavn" class="login login-input" value="password"  />

    <input class="login login-submit" type="submit" value="login" />
</div>