z-index with position: relative

Fri Aug 9 19:32:05 BST 2002

Hello all!

I'm trying to get some divs to position themselves correctly when I use position: absolute and
z-index and I'm having trouble  with Konq 3.01.

In the following sample, I've got two sets of divs. One uses position: absolute and the other uses
position: relative. The position:absolute guys work just as I would expect. However, the position:
relative divs do not. In both cases, the red div should be on top of the pink div. However, when
using position: relative, the pink div is on top. Mozilla and Opera display this properly.

Is this a problem in Konq, or am I doing something wrong? I imagine if it's a problem in Konq,
fixing it may be as simple as adding "relative" to a case statement somewhere in the z-index code
where "absolute" is now when deciding whether or not to apply the z-index.

Any thoughts?

*************************************************
recreation follows
*************************************************

<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en" >
 <head>
<title>
test
</title>
<meta http-equiv="Content-Type" content="text/html" />
<meta http-equiv="Content-Language" content="en" />

</head>
<body>

<div style="position: absolute; background-color: blue;">

<div style="position: relative; width: 300px; height: 300px; z-index: 1; background-color:
red;"> </div>
<div style="position: relative; top: -300px; width: 200px; z-index: 0; height: 350px;
background-color: pink"> </div>

</div>

<div style="position: absolute; top: 20px; left: 400px; width: 300px; height: 300px; z-index: 1;
background-color: red;"> </div>
<div style="position: relative; top: 20px; left: 400px; width: 400px; height: 350px; z-index: 0;
background-color: pink"> </div>

</body></html>

__________________________________________________
Do You Yahoo!?
HotJobs - Search Thousands of New Jobs
http://www.hotjobs.com