1

以下のコードは、私が今日遭遇した非常に奇妙な動作を再現しています(Windowsでのみ発生します)。ホバーすると、Firefoxcheckboxは黒い境界線で色を付けます。画像に見られるように。

黒い境界線は存在してはなりません

他のすべてのブラウザ(chrome、safari、およびすべてのIE)は、同様の効果を経験しません。

heightFirefoxを(属性を維持して)どのように動作させることができるかについてのアイデアはありますか?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <style type="text/css">
        #c-box {
            height: 20px;
        }

    </style>
</head>
<body>
        <input id="c-box" type="checkbox">
        <label for="c-box">this is a checkbox</label>
</body>
</html>
4

1 に答える 1

0

Windows XP の Firefox 5 で同じ動作を経験しました。HeightCSS値を に設定し、代わりにチェックボックスを適切に配置するためにauto使用することで、黒い背景をなくすことができた唯一の方法です。margin-top

例:

注: この例で#c-boxは、 はinput type="checkbox要素です。

それ以外の

#c-box {
    height: 20px;
}

使用する

#c-box {
    margin-top: 5px; /* Test to see which margin value matches the look you desire */
    height: auto;
}

プロパティを保持したいとおっしゃっていheightましたが、このソリューションはレイアウトを壊すことなく機能しました。

それが役立つことを願っています! 私自身の問題に対する数え切れないほどの答えを見つけた後、ここで実際に質問に答えるのはこれが初めてです。:)

于 2011-07-25T15:40:43.013 に答える