3 replies [Last post]
roscoe
roscoe's picture
Offline
Enthusiast
Last seen: 12 years 19 weeks ago
Joined: 2006-03-09
Posts: 138
Points: 0

I have a div that I want overlapping on two divs. It will start on the inside div and come out about 26px on to the outer div. It works great in FF, but in IE6 once the div hits div#container it gets cut off and nothing shows up on div#page. See code below:

and here is the CSS

div#page {
margin: 20px auto;
max-width: 1600px;
}

div#container {
margin: 0px auto;
width: 90%;
min-width: 900px;
}

div#overlappingDiv {
width: 346px;
height: 264px;
background: #ccc;
z-index: 1000;
float: left;
margin-left: -26px;

}

As you can see I tried using z-index, but that didn't work. Any ideas?

mihirc
mihirc's picture
Offline
Leader
Pune, Maharashtra, India
Last seen: 6 years 16 weeks ago
Pune, Maharashtra, India
Timezone: GMT+5.5
Joined: 2007-05-09
Posts: 728
Points: 204

hi, I think you are doing

hi,

I think you are doing the right thing by using z-index. But you have made a few mistakes here. Z-index needs to be given to both the element. for ur's it should also be given to div#container. Also z-index needs to have a position attribute. So you will also need to giv position:relative; to both the elements.

that should work...

mihir. Smile

Proprietor - Thoughtfulviewfinder Services
Web Development | Design | Merchandise | Photography
My personal blog: MihirChhatre.com

roscoe
roscoe's picture
Offline
Enthusiast
Last seen: 12 years 19 weeks ago
Joined: 2006-03-09
Posts: 138
Points: 0

PROBLEM SOLVED

That worked perfect, thanks a lot.

mihirc
mihirc's picture
Offline
Leader
Pune, Maharashtra, India
Last seen: 6 years 16 weeks ago
Pune, Maharashtra, India
Timezone: GMT+5.5
Joined: 2007-05-09
Posts: 728
Points: 204

My Pleasure.. mihir

:thumbsup:

My Pleasure..

mihir Smile

Proprietor - Thoughtfulviewfinder Services
Web Development | Design | Merchandise | Photography
My personal blog: MihirChhatre.com