Z-index of img not working

SpaceshipSpaceship
Watch

VaporAction

Established Member
Impact
0
I'm making a navigation bar at the top of the page that I want to remain fixed while the use scrolls down the page...I have no problems if I make the bar with HTML and CSS but when I tried to make the bar from an image it doesn't seem to work...specifically, the image doesn't seem to be taking the z-index that I give it so that when you scroll the rest of the page runs over top of it...
I'm using Firefox so it has nothing to do with the various IE bugs...
the CSS I'm using runs something like this....

.navImage {
position: fixed;
z-index: 50;}

the only other clue is that the content of the page is an embedded swf file...is there something about the z-index of swf files and images?
 
0
•••
The views expressed on this page by users and staff are their own, not those of NamePros.
AfternicAfternic
From what I understand you are applying this straight to the image correct? If so try using a div tag with the width and height the same as the image, and apply the z-index to the div rather than the image.
 
0
•••
Agreed with -bank-. Put the image into a div, this should make it work, apple the things to the div and not the image, the image will move along with the div :)

Code:
<style type="text/css">
.navImageDiv {
position: fixed;
z-index: 50;
height:auto;
width:auto;}
</style>
<div class='navImageDiv'>
<img src="nameproslogo.gif" title="Namepros Logo">
</div>

Haven't tested, lemme know if it works :)
 
0
•••
Try applying the z-index attribute to the diz or whatever is containing the image, and set one for the container of the item you want it to overlay which is lower
 
0
•••
lee101 said:
to the diz or whatever is containing the image

to the diz ;) its a <div> tag, part of xhtml and css.

thanks for totally clearing it up beaver6813, my post was slightly wish washy
 
0
•••
I applied the css to a div containing the img but it still doesn't work BUT I have since discovered that you can set the swf's param to "wmode"="transparent" which seems to make it more z-index friendly BUT ONLY if there arent' any images in the nav bar...is anyone familiar with why including an image in a nav bar would weaken it's z-index? I even tried placing a div under the image to sort of bolster it, but that didn't work...
 
0
•••
Dynadot — .com TransferDynadot — .com Transfer
Appraise.net

We're social

Spaceship
Domain Recover
CatchDoms
NameMaxi - Your Domain Has Buyers
  • The sidebar remains visible by scrolling at a speed relative to the page’s height.
Back