faulty layering

swapped links...

chaotic test page
#06
21.mar.2005

Link A shall NOT work
Link C shall NOT work

container 1 - accessible links from below

Link B shall work
Link D shall work

container 2 - covered links from above

.link-a {
position: absolute; 
top: 190px; 
left: 10px;
font-weight: 800;}

.link-b {
position: absolute; 
top: -80px; 
left: 10px;
font-weight: 800;}

.link-c {
position: absolute; 
top: 190px; 
left: 260px;
font-weight: 800;
width: 240px;}

.link-d {
position: absolute; 
top: -80px; 
left: 260px;
font-weight: 800;
width: 240px;}

#container-1,#container-2{
height: 92px;
width: 500px;
margin-bottom: 40px;
position: relative;
z-index: 0;
border-top: solid 1px #999;
border-left: solid 1px #999;
border-bottom: solid 1px #bbb;
background: transparent;}

.cover {
float: right;
height: 100%;
width: 250px;
margin-left: -240px;
border-left: solid 1px #bfbfbf;
background: 
url(imagedepot/transparent.png);}

Notes:

Links are swapped between upper and lower container, using absolute positioning. A cover-effect from the lower container should be the result.

- Link A is behind default background in container 2, and should therefore not work.

- Link C is behind transparent image in container 2, and should therefore not work.

Opera OK.

Moz/FF OK.

Safari OK.

IE6 FAILS. Link A is accessible. Link C is OK.
- Both modes tested.

IE5.0 win OK.

IE5.2 Mac FAILS. Link A is accessible. Link C is accessible.

tested browsers:

Opera:
win2K: 7.22, 7.50, 7.54
Mac OS-X: 7.54
Moz:
win2K: 1.4, 1.7.2
FF:
win2K: (0.6), 0.8, 1.0
Mac OS-X: 1.0
Safari:
Mac OS-X: 1.2.4
IE:
win2K: 5.0, 6.0
Mac OS-X: 5.2
Netscape (Moz):
win2K: 7.2(Moz 1.7.2)

go to test-menu