html - 提交按钮跨浏览器定位

Question

所以我正在尝试制作一个包含 2 个字段和一个提交按钮的登录框。提交按钮在每个浏览器中的位置都不同。在 Firefox 中，它按预期工作，但在 IE8 和 Safari 中，垂直对齐被搞砸了。有解决此问题的想法吗？

这是问题的屏幕转储: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

试试这些

.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; 
}

和

<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>