1

下面的代码重现了我今天遇到的一个非常奇怪的行为（只发生在 windows 上）。悬停时，Firefoxcheckbox用黑色边框着色。如图所示。

黑色边框不应该存在

所有其他浏览器（chrome、safari 和所有 IE）都不会体验到类似的效果。

关于我如何（保持height属性）使 Firefox 正常运行的任何想法？

<!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 中遇到了同样的行为。我能够通过将 CSSHeight值设置为 来消除黑色背景的唯一方法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 回答