HTML CSS basic layout question? I am learning CSS and divs, and I've followed several "basic layout with divs" tutorials and none of them covered what I'm trying to do exactly.
See this image:
http://img34.imageshack.us/img34/35/horizs.png
The red area should be an image 60px tall and 100px wide or just a div that is 60px tall 100px wide - the point is the size is fixed and does not change. It should be 20px away from the left and top of the page, and also 20px away from the green area.
Green area is indented down more - 30px from top. Green area is just a blank background color div which stretches if the browser window changes size. This is the most important part and it's what I can't figure out.
Green area is also 20px away from the 40 by 40 image on the right.
ALL margins, and the size of both images should be static and not change at all, although if you stretch the right side of the browser, the blue image should 'stick' to the right, just as if you stretch the left side of the browser, the red image would stick to the left. The only part of the page I want to actually STRETCH is the green area.
Is this simple layout possible with divs - can someone please tell me the code used or technique? |