1

我有以下测试页面:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title>Test</title>
    <style type="text/css">
        .test {
            width: 200px;
            height: 200px;
            position: absolute;
            left: 0;
            top: 0;
        }
    </style>
</head>
<body>
    <span style="position:relative; left: 100px">
        <div>
            <object class="test" data="flash.swf">
                <param name="wmode" value="transparent"/>
            </object>
            <div class="test" style="background-color: red; opacity: 0.5"></div>
        </div>
    </span>
</body>
</html>

我希望对象和类为“test”的 div 元素的位置相同。但这在 FF 和 Safari 中都不会发生。这是为什么?div 和 span 的排列是它发生的必要条件。

4

3 回答 3

3

您的 HTML 无效。跨度不能包含 div。

浏览器在执行错误恢复的方式上并不总是一致的。

编写有效的 HTML 并使用验证器对其进行测试。

于 2012-08-22T13:38:36.170 回答
1

span是一个内联元素,它不能包含其他块元素。添加display:block到您的span以使其阻塞,然后它将起作用。

工作示例

于 2012-08-22T13:40:07.733 回答
0

起初你需要为对象设置display: block也许这就是问题......

于 2012-08-22T13:35:21.013 回答