0

我在字段集中有一个字段集。每种类型的字段集在悬停时都会改变颜色。在 Firefox 中运行良好，但在 IE8 和 IE8 的 IE7 兼容模式下，当我将鼠标悬停在子字段集上时，它会跳转（看起来一些填充被删除，但这不是我的 css 所说的）。

有人可以帮我弄清楚如何防止 IE 中的跳跃效应吗？为什么悬停时子字段集会跳转，而不是父字段集？

<!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>
    <style type="text/css">
        fieldset.property { background-color: #EDF5FF; }
        fieldset.property:hover { background-color: #C1DDFF; }
        fieldset.service:hover { background-color:#EDF5FF; }
    </style>
</head>
<body>
    <fieldset class="property">
        Parent fieldset<br />
        Parent fieldset<br />
        Parent fieldset<br />
        <fieldset class="service">
            Child<br />
            Child<br />
            Child<br />
        </fieldset>
        Parent fieldset<br />
        Parent fieldset<br />
        Parent fieldset<br />
    </fieldset>
</body>

4

2 回答 2

3

我也不确定为什么 IE 会以这种方式处理子元素，但通过专门定义填充和通常的边距，可以防止这种情况发生。

字段集{边距：0；填充：0；}

于 2009-10-08T20:08:56.833 回答
0

我仍然不知道为什么 IE8 会让孩子跳起来，但我找到了解决方法：

如果我添加一种样式来显式设置字段集的填充，则将鼠标悬停在该字段集上时保持不变：

/* Add to make rendering in IE and Firefox the same /*
fieldset { padding:2px; }
于 2009-10-08T16:15:26.587 回答