Hi all. I need help in arrange the div of my website.My website has 3 main DIVs.DIV1 - My Header (fixed height)DIV2 - Dynamic Content area so height variesDIV3 - My Footer (fixed height)All DIVs have 100% width.The DIV1 header must have 0px with respect to the top of the browser. I wanted the 3 DIVs must be on top of each other as shown in the image. If the user has a resolution taller than my 3 DIVs, what will be at the most bottom after the DIVs are just empty spaces. However, I cant seem to get that layout working. the DIV3 footer keep giving me trouble.Here is my following CSS code:\[code\]div1 {position: fixed;top: 0px;}div2 {position: relative;top: 0px;}div3 {position: fixed;top: 0px;}\[/code\]If I use position: fixed for DIV3, and my DIV2 has a shorter content, the whole website will look weird.If I try changed to position: relative for DIV3, DIV3 will overlap and appear in front of DIV1.Is there any better suggestion for that?Thank you very much.
