The problem is when i want to put an element("a" in my code) into an absolute positioned element and i also want this element("a") has a fixed height, then ie6 will render this element("a") as a common block element with a 100% width. I also found that if any css property can make element hasLayout added to the element in absolute positioned element in ie6, the problem will occur.
ie7 8 and other standard browser can show it correctly.
Does anyone know how to fix it?
ie7 8 and other standard browser can show it correctly.
Does anyone know how to fix it?
Code:
<!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" />
<title>t</title>
<style type="text/css">
.absolute { position:absolute; border:1px solid #369 }
.absolute a { display:block; background-color:#0F9; height:20px }
.absolute a:hover { background-color:#09F }
</style>
</head>
<body>
<div class="absolute">
<a href="#">test inline element in absolute positioned block element</a>
<a href="#">test inline element in absolute positioned block element</a>
<a href="#">test inline element in absolute positioned block element</a>
</div>
</body>
</html>