Can you post more info about this? The two links you put in don't seem to be the same thing. Can you post a link to the page that you have a screenshot of? And, which browsers this overlap is happening in?
Also, my experience with z-index has been horrible...I never ever use it because it doesn't seem to be consistently compatible with anything....Use the order of your xhtml code to set levels instead....
-Rob Feature
Geeks and God Co-Host
www.bobchristenson.com
To do overlapping divs without z-index. you just need your xhtml to be ordered correctly, and then use positioning...
With the html, whatever div is first will be underneath any divs that come later. So, whatever div you want on top should come after the div that slides underneath. That's step one.
By default, divs won't overlap, obviously, so step 2 is to reposition your divs using either the position attribute or the margin attributes. For example, if you have 2 divs side by side, and the div on the right came second in the html code (obviously) you coudl set:
position: absolute;
left: 0px;
top: 0px;Or (and correct me if I'm wrong, I don't usually use this behavior but I believe it works), on that right hand div you could simply do:
margin-left: -50px;
and it woudl slide 50 pixels left, right overtop of the other div.
That's the kind of stuff you'd do to overlap things without using z-index. Hope it helps!
-Rob Feature
Geeks and God Co-Host
www.bobchristenson.com
Hello everyone,
I have just tried Rob Feature's solution...but somehow I don't get this working.
On the left-side of my layout I have a vertical 'accordion menu' in DIV...with to the right next to it the content in another DIV. When the content is a portfolio page with images I would like to present a little description of a image on MouseOver and 'displayed below the 'accordion menu''.
Using the z-index:0; on the 'accordion menu' DIV and z-index:1; on the content DIV doesn't work, so I was looking for a solution and stumbled upon this page.
When I try the solution Rob mentions, with the positioning...it also doesn't work. Rob pointed out that one DIV should come after another in the HTML...but this was fine...and it doesn't work.
The 'tooltip' I present in the content DIV is positioned absolute...but dissapears under the 'accordion menu' DIV. And the DIVs are put correctly in orde in the HTML.
What could I be doing wrong?
I am trying to overlap to divs... Tried working z-index, but I can't get it to work...
Sample Image
Sample of page w/o images - - Sample page
Follow me on twitter : http://twitter.com/svjenkinsjr