CSS divs / layers z-index

  • Thread starter Thread starter Wayne-I-M
  • Start date Start date
W

Wayne-I-M

Hi

Wndows 7 (expression web - bit also tried frontpage)

Sorry if this is the wrong place but all the win7 forums seem to be a little
.....hmmmm :-(

I have a page consisting of a css drop-down menu and a couple of pictues.
Sounds somple ? driving me mad. All I am rying to do is to center the whole
lot and have the drop-down show over the pictures on-mouse-over

I can center the css drop down ona div (set the left and right margins to
auto) and include the pictures in divs - everything centers really well.
Down no matter what I do I can't get the z-index of the pictures to be lower
than the drop-down (so the pictues are always on top)

I have tried to put each section in layers - this time the drop-down and
pictures are all in order (the drop-down shows over the pictues) - but I
can't center them (without giving absolute values - which I don't want).

Sorry I can't post the page as it's on my win7 machine and it's not on the
web (am previewing on the machines browser).

So, have anyone been through this before - or has anyone got a web link that
may help.

Don't really want to spend another day on this (should be simple) problem.

Thanks for any help
 
z-index only works with positioned elements.

<div style="margin: 0 auto; width: 760px;">navigation with drop downs goes
here</div>
<div style="margin: 10px auto; width:760px;">Images goes here</div>

Provided the page also has a complete and valid !doctype there is no reason
why the menu dropdowns will go under the images, unless:
The images are flash or silverlight movies
The images are contained in absolutely positioned HTML elements.

Seeing the page might help.
--
Ron Symonds
Microsoft MVP (Expression Web)
http://www.rxs-enterprises.org/fp

Reply only to group - emails will be deleted unread.
 
If you set position:relative you can then use z index, eg
<div id="dropdown" style="position:relative;z-index:1000">dropdown</div>
<div id="images" style="position:relative;z-index:1">images</div>

Cheers,
Jon
http://MyMobileDeal.com
 
Back
Top