Position the content div so that it is positioned relatively (this is
what it is by default, but the explicit style makes a HUGE difference).
Then , make the position of the HTML promobox to be "absolute" and then
top/left to zero.
div#content {
text-align:center;
margin-top: 4px;
position: relative ;
}
div#content img{border: 1px solid #003366;}
div#content .promobox {
Position: absolute ;
top: 100px;
Left: 0px ;
border: solid 1px #000000;
width: 200px;
height: 100px;
Z-index: 100 ;
}
..... See if that helps.
......................
Ben Nadel
Certified Advanced ColdFusion MX7 Developer
www.bennadel.com
Need ColdFusion Help?
www.bennadel.com/ask-ben/
-----Original Message-----
From: Will Tomlinson [mailto:[EMAIL PROTECTED]
Sent: Monday, April 23, 2007 11:16 AM
To: CF-Talk
Subject: CSS layered div problem
I can't quite get a div to position itself over another div. What I'm
trying to create is a content div that has a big image in it. Then
placing a promo div box right on top of it... the promo box will
contain html text.
My problem is, one appears either above or below the other depending on
where I place it. I tried some floats, positions, nothing is working.
Here's my content css:
div#content {text-align:center; margin-top: 4px;}
div#content img{border: 1px solid #003366;}
div#content .promobox {
top: 100px;
border: solid 1px #000000;
width: 200px;
height: 100px;
float: right;
}
And the html
<div id="content">
<img src="images/contentpic.jpg" alt="content" width="680">
<div class="promobox">
This is some promo text
</div>
</div>
Thanks,
Will
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~|
Upgrade to Adobe ColdFusion MX7
Experience Flex 2 & MX7 integration & create powerful cross-platform RIAs
http://www.adobe.com/products/coldfusion/flex2/?sdid=RVJQ
Archive:
http://www.houseoffusion.com/groups/CF-Talk/message.cfm/messageid:276044
Subscription: http://www.houseoffusion.com/groups/CF-Talk/subscribe.cfm
Unsubscribe: http://www.houseoffusion.com/cf_lists/unsubscribe.cfm?user=89.70.4
