944,028 Members | Top Members by Rank

Ad:
Nov 25th, 2007
0

overlapping divs

Expand Post »
I have two divs which both have backgrounds in my CSS properties.

Unfortunately, div2's background overlaps div1's background. But I want it the other way around. In other words, I want div1's background over div2's. I've tried z-index but it didn't work. How do i solve this?
Similar Threads
Reputation Points: 10
Solved Threads: 0
Light Poster
jetru is offline Offline
27 posts
since Jun 2006
Nov 25th, 2007
0

Re: overlapping divs

You must render the div you want on top last. This means that the div to be on top must be inside the other div in the HTML file.

HTML is not normally supposed to place objects on top of each other. Objects are normally supposed to have their own places on the page without overlap.
Reputation Points: 730
Solved Threads: 181
Nearly a Senior Poster
MidiMagic is offline Offline
3,314 posts
since Jan 2007
Nov 26th, 2007
0

Re: overlapping divs

But I would like only a part of the div to overlap the other div...not the whole thing...
Reputation Points: 10
Solved Threads: 0
Light Poster
jetru is offline Offline
27 posts
since Jun 2006
Nov 28th, 2007
0

Re: overlapping divs

What do these divs contain. Depending on the content, there may be other ways to do this.
Reputation Points: 730
Solved Threads: 181
Nearly a Senior Poster
MidiMagic is offline Offline
3,314 posts
since Jan 2007
Dec 1st, 2007
0

Re: overlapping divs

i had the same problem.
thanks
cashu
http://tech-unite.com/forum/viewtopic.php?f=5&t=10
Reputation Points: 10
Solved Threads: 0
Newbie Poster
cashu is offline Offline
4 posts
since Nov 2007
Dec 3rd, 2007
0

Re: overlapping divs

z-index property with positioning

divname { position:absolute; z-index:1; }
divname2 { position:absolute; z-index:2; }
probably in a container div
Reputation Points: 37
Solved Threads: 1
Posting Whiz in Training
cmills83 is offline Offline
249 posts
since Jun 2004
Dec 3rd, 2007
0

Re: overlapping divs

then position with top:xxpx; left:xxpx; or right or bottom, etc.
Reputation Points: 37
Solved Threads: 1
Posting Whiz in Training
cmills83 is offline Offline
249 posts
since Jun 2004
Dec 6th, 2007
0

Re: overlapping divs

By default, elements that are formatted later in an HTML document are stacked on top of earlier elements. In addition, elements placed with CSS positioning are stacked on top of elements that are not. To specify a different stacking order, use the style

z-index: value

where value is a positive or negative integer, or the keyword "auto". Objects are stacked based on their z-index values, with the highest z-index values placed on top.

The z-index style only works for elements that are placed with absolute positioning. Also, an element's z-index value determines its position relative only to other elements that share a common parent.

So a container div enveloping the other two divs is required.

I hope that helps...stacking objects can get tricky sometimes.
Team Colleague
Reputation Points: 92
Solved Threads: 21
Posting Pro in Training
FC Jamison is offline Offline
436 posts
since Jun 2004
Dec 6th, 2007
0

Re: overlapping divs

All these work just fine in firefox. IE just refuses to accept any of these! I tried everything!
Reputation Points: 10
Solved Threads: 0
Light Poster
jetru is offline Offline
27 posts
since Jun 2006

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in HTML and CSS Forum Timeline: empty space divs in IE
Next Thread in HTML and CSS Forum Timeline: How to switch layouts without affecting content





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC