Question

I want to build a fluid template where there is a content container with fixed margin on all 4 sides of the web page. If browser is resized, content box would change on all sides too keeping the same margins but changing height and width. Because of the height 100% issues I am not able to get the bottom margin correctly done if content is too long. In my case content just stretches without stopping and adding scrollbars.

See example:

http://jsfiddle.net/QzgHm/1/ (section element needs to keep bottom margin)

Answer 1

Try position: absolute; and then define pixels values for top, bottom, left, and right. This will essentially give you your set margin all the way around. I couldn’t tell on your example which div or section you wanted these margins set on, so just be sure to use position: relative on the parent element