2

CSSを使用して、入力ボタンをリンクのように見せています。

私はそれを次のようにスタイリングしました：

input#linkLike {
    background: none;
    border: none;
    cursor: pointer;
    margin: 0;
    padding: 0;
    text-decoration: none;
    font-weight: bold;
    font-size: 12px;
    display: inline;
    vertical-align: baseline;
}

これはChromeでは正常に機能しますが、Ffにはボタンの周りに空白があり、IEにはさらに大きな空白があります。

http://jsfiddle.net/S4nF9/5/

この空白はどこから来て、どうすれば削除できますか？

4

2 に答える 2

3

このページによると、

Firefox は、描画のためにボタン要素自体の中で疑似要素を使用します。上記のように、これは 2px のパディングがこの内部疑似要素の上下に追加されることを意味するため、次のように削除できます。

button::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner {
    padding: 0 !important;
    border: 0 none !important; 
}

これで Firefox がお世話になりました。新しいフィドルを参照してください。
(注: この記事では上下について言及していますが、左右のパディングでも機能します。)

ここには IE がないので、今はテストできません。申し訳ありません。

于 2013-02-04T18:03:42.683 に答える
0

幅の値を指定できます。

于 2013-02-04T17:40:35.330 に答える