我有以下测试页面:
<!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的排列是它发生的必要条件。
您的HTML无效。跨度不能包含div.
浏览器执行错误恢复的方式并不总是一致的。
编写有效的HTML并使用验证器进行测试。
span
是一个内联元素,它不能包含其他块元素。将display:block
添加到您的span
以使其阻塞,然后它就会工作。
工作示例
首先需要为对象display: block
设置,也许这就是问题所在。。。