html - 入力送信と「a」タグのスタイルが同一に見える - Firefox の問題

Question

ページ上でボタン (入力) とリンクが同じように見えるようにしようとしていますが、Firefox で位置合わせの問題が発生しています。これはHTMLです：

<p>
    <input type="submit" value="Create New User" />
    <a class="linkButton" href="/Admin">Cancel and Return to User Index</a>
</p>

次のCSSを使用しています。

.linkButton, .linkButton:link, .linkButton:visited, input[type="submit"], input[type="button"] {
    background-color: #4AACC5;
    border: 1px solid #4A77C4;
    color: #FFFFFF;
    cursor: pointer;
    height: 27px;
    margin: 2px;
    padding: 3px 6px;
    text-align: center;
    text-decoration: none;
    width: auto;
    font: inherit;
}

上記のセットアップでは、Chrome ではすべて正常に動作しますが、Firefox では 2 つの要素が整列していません。

このフィドルは FF と Chrome の両方で確認できます: http://jsfiddle.net/hqJDZ/5/

aさて、両方のケースで のようなものを使用しないソリューションが必要onclick="javascript:submit();"です。ビューはスキャフォールディングされており、うまく機能するので、純粋な HTML/CSS ソリューションをお勧めします。

私が IE について言及していないことにお気付きかもしれませんが、私は当分の間そこに行きたくないだけです :P

Answer 1

クラスに 2 つの属性を追加するだけです。

Display:block;
float:left;