考虑下面的网页。
<img> 相对于其父元素绝对定位，当我在 Safari 或 Firefox 上加载此页面时，<img> 出现在右上角，如预期一样（请参见第一张图片）。 但是，如果从 <div> 中删除边框，例如通过设置 border-width: 0，<img> 将绝对相对于其兄弟元素 <p> 定位！ 请参见图片＃2。 为什么会这样？边框会产生什么差异？<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
body {
margin: 0;
}
div {
position: relative;
left: 0;
top: 0;
border: 1px solid red;
}
img {
position: absolute;
right: 0;
top: 0;
}
p {
margin: 20px;
}
</style>
</head>
<body>
<div>
<img src="content/en/flag.png" />
<p>This is a test</p>
</div>
</body>
</html>
