trying to get a multi-row div to appear within an outer div... first "row" works fine, 2nd overlays ...
I made 2 images, one, test.png is a green background image, 400 (w) x 840 (h) ... 2nd is red background, 360 (w) x 756 (h)... it doesn't appear I can upload them? I did the 2nd in red so I could tell if it was overlaying... it is overlaying the first column... I can't find relevant text/instructions to tell me how to do this... the divs left_promo and right_promo are the "rows"... when I invoke the left_promo for the 2nd "row", it overlays the first row, left column, and does not start on a new "row" boundary... if you need the images, I can include them if someone tells me how... it seems I can't...
1) HTML code
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<link rel="stylesheet" type="text/css" href="C:\GNO\css\newmain.css" />
<p>some text</p>
<div style="padding: 0 8px; height: 1100px; width: 1150px; overflow: auto;">
<div class="left_promo">
<img src="C:\GNO\images\test.png">
</div>
<div class="right_promo">
<img src="C:\GNO\images\test.png">
</div>
<div class="left_promo">
<img src="C:\GNO\images\red.png">
</div>
</div>
<!-- <div style="padding: 0 8px; height: 800px; width: 1150px; overflow: auto;">
-->
<!-- </div>
-->
</html>
2) CSS code
@charset "utf-8";
/* CSS Document */
/* padding is top, right, bottom, left */
div.left {
background:#F7E2F1;
height:1650px;
width:200px;
position:absolute;
margin:10px 10px 10px 10px;
}
div.left_promo {
height:450px;
width:565px;
position:absolute;
margin:10px 10px 10px 10px;
}
div.right_promo {
height:450px;
width:565px;
position:absolute;
margin:10px 10px 10px 620px;
}
div.right{
background:#F7E2F1;
height:1650px;
width:650px;
position:absolute;
right:0px;
margin:10px 440px 10px 10px; /* the right offset margin pushes the content left */
}
.container{
background:#F7E2F1;
height:1650px;
width:1550px;
position:relative;
margin:10px 10px 10px 10px;
}
.bottom{
background:purple;
height:150px;
width:980px;
margin:140px 10px 10px 10px;
}
I didn`t understand the problem quite well. But strongly believe this what you wanted.
Here is the fiddle http://jsfiddle.net/tyy6p621/. You only need to properly close and open some tags