how can you stop relative - absolute div collapse
How can I stop the div #banner_ad_wrapper from collapsing. The reason I am using position absolute on .banner_ad is I want to stack them on top of each other. Should I be doing this a different way. Thanks
#banner_ad_wrapper {
position:relative;
margin-top:20px;
}
.banner_ad {
width:920px;
margin-left:20px;
position:absolute;
top:0;
}
<div id="banner_ad_wrapper">
<div class="banner_ad">
<img src="images/010713_JewelryHandbagWalletSale_site.jpg" width="920" />
</div>
<div class="banner_ad">
<img src="images/011013_save10whenyouspend100v4.jpg" width="920"/>
</div>
</div>
If that help... lucky. If not a link to the page or the code would give us enough information to provide a full solution. As it stands you have no z-index; so how do you intend to manage the stacking order?
Cd&
Cd&
ASKER
The stacking order is not relevant I will be using javascript to toggle show and hide the divs with the class banner_ads. I just want to know how to put one div on top of another. If you use a parent div positioned relative and a sibling div positioned absolute then the parent collapses. So how can you stack divs on top of each other but keep the rest of you content to flow in a normal fashion.
ASKER
overflow:visible; did not work.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
I did not get an answer that solved the problem. However from other resources i found the answer.
#banner_ad_wrapper {
position:relative;
margin-top:20px;
overflow:visible;
}