Forum Moderators: not2easy
Example:
<div style="float: left;>
Content
</div>
<div class="width: 160px; height: 600px; vertical-align: top; text-align: left; float: right;">
<img src="/img/simulate_ad_160x600.gif"/>
</div>
<div class="clear"></div>
The problem is that as soon I float the left div, the divs get corrently positioned but the left content div loses it's auto-sizing.
Can you not add an ID to the advertisement image and then float the image right - or position it top right and add some margin to add some space?
E.g.
<img src="/img/simulate_ad_160x600.gif" width="160" height="600" id="advert" />
Add position:relative to your variable width div style. Then add a style for the advert:
#advert {
position: absolute;
top: 0;
right: 0;
}
This should position to the advert to the top right, then you can add margin and padding as you see fit.
#advert {
float: right;
}
This may also work. I'm no expert in CSS but I've dabbled quite a bit, so this may be something to try. Others who are more experienced may have a better solution.
Try to only float your ad.
Use margins on the main content if you do not want it to wrap in under the ad.
A footer might need to be forced to clear the float as needed.
