Forum Moderators: not2easy

Message Too Old, No Replies

z-index problem

IE doesn't show it

         

bigcat

4:21 pm on Feb 17, 2009 (gmt 0)

10+ Year Member



I am working on a website and I have problems with showing image controls in the slideshow under IE. It works fine with FF, Opera, Chrome, Safari... I've tried with z-index but nothing changed.
CSS extract is

.sshow {
height: 320px;
width: 570px;
}

ul.crossfade {
padding: 0;
margin: 0;
list-style: none;
position: relative;
float: left;
top: 0;
left: 0;
}

#fade-1 li {
margin: 0;
padding: 0;
width: 570px;
height: 320px;
visibility: hidden;
position: absolute;
top: 0;
left: 0;
}

li img {
display: block;
border: none;
}

.con_norm {
background: none;
}

.con_hoverR{
background: transparent url(arrR.gif) 0 0 no-repeat;
}

.con_hoverL{
background: transparent url(arrL.gif) 0 0 no-repeat;
}

#fade-1-next {
width:285px;
height: 320px;
float:left;
}
#fade-1-previous {
width:285px;
height: 320px;
float:left;
}

#controls {
position: absolute;
top: 85px;
left: 45px;
z-index: 100;
cursor: pointer;
}

HTML source:

<div class="sshow">
<div id="controls">
<div id="fade-1-previous" class="con_norm" onmouseover="this.className='con_hoverL'" onmouseout="this.className='con_norm'"></div>
<div id="fade-1-next" class="con_norm" onmouseover="this.className='con_hoverR'" onmouseout="this.className='con_norm'"></div>
</div>
<h2 class="accessibility">Atelje Domus Slike</h2>
<ul id="fade-1" class="crossfade transition-fadeoutfadein">
<li><img src="images/image-1.jpg" alt="Shopping Mall Rodi&#263; MB u Novom Sadu" /></li>
<li><img src="images/placeholder.jpg" alt="ode piši lep opis" /></li>
<li><img src="images/placeholder.jpg" alt="ode piši lep opis" /></li>
</ul>
</div>

Some advice, please.

[edited by: swa66 at 4:33 pm (utc) on Feb. 17, 2009]

[edited by: bigcat at 4:58 pm (utc) on Feb. 17, 2009]

swa66

4:36 pm on Feb 17, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Welcome to WebmasterWorld! [webmasterworld.com]

Links to your code etc are not allowed on WebmasterWorld, so you'll have to describe it in a bit more detail. Some minimal code that still reproduces the problem might be appropriate as well.