3 replies [Last post]
djtek05
Offline
newbie
Last seen: 16 years 41 weeks ago
Joined: 2005-11-01
Posts: 2
Points: 0

Alright, I'm designing a page with the following code

<p><div class="1">...</div>
                <div class="2">...</div>
                <div class="3">...</div>
<img src="logo.gif" width="1024" height="300" class="bottom"/></p>

and my CSS file reads like this

body {background-color:#FFFFFF;}

.1 {
	position:absolute;
	top:197px;
	z-index:10;
	elevation:above;
	visibility: visible;
	border:0px;
	width: 428px;
	height:40px;
}

.2 {
	position:absolute;
	top:238px;
	z-index:10;
	elevation:above;
	visibility: visible;
	border:0px;
	width: 484px;
	height:40px;
	left: 10px;
}

.3 {
	position:absolute;
	top:278px;
	z-index:10;
	elevation:above;
	visibility: visible;
	border:0px;
	width: 484px;
	height:40px;
	left: 10px;
}

.bottom {position: absolute; top:0px; left:0px; z-index: 1; elevation:below;}

And this shows up fine in Dreamweaver...however, when I take it to be previewed in IE or FF, all the text loses it's positioning and (I'm assuming) is put at the top behind the image...despite the fact that its z-index is greater than that of the image ](*,) ....please help!

wolfcry911
wolfcry911's picture
Offline
Guru
MA, USA
Last seen: 8 years 24 weeks ago
MA, USA
Timezone: GMT-5
Joined: 2004-09-01
Posts: 3224
Points: 237

Z-Index Browser Issues

Don't start class names with a number.
Don't use absolute positioning for layout.
Don't use Dreamweaver.

djtek05
Offline
newbie
Last seen: 16 years 41 weeks ago
Joined: 2005-11-01
Posts: 2
Points: 0

Z-Index Browser Issues

Thanks, I changed the classes to letters instead and it worked. As far as the others go, I am in the process of conversion for the absolute to relative and I use Dreamweaver strictly for the measurement tools available.

wolfcry911
wolfcry911's picture
Offline
Guru
MA, USA
Last seen: 8 years 24 weeks ago
MA, USA
Timezone: GMT-5
Joined: 2004-09-01
Posts: 3224
Points: 237

Z-Index Browser Issues

Excellent!