고정 여백 콘텐트 컨테이너가있는 유체 템플릿

Question

웹 페이지의 4면 모두에 여백이 고정 된 콘텐트 컨테이너가있는 유체 템플릿을 작성하려고합니다. 브라우저의 크기를 조정하면 내용 상자가 모든면에서 변경되어 동일한 여백을 유지하면서 높이와 너비가 변경됩니다. 높이가 100 %이기 때문에 내용이 너무 길면 하단 여백을 올바르게 처리 할 수 ​​없습니다. 제 경우에는 스크롤 막대를 멈추고 추가하지 않고 내용을 확장합니다.

참조 예 :

http://jsfiddle.net/QzgHm/1/ (섹션 요소가 아래쪽 여백을 유지하기 위해 필요)

Answer 1

position: absolute;을 시도하고 top, bottom, left 및 right에 대한 픽셀 값을 정의합니다. 이것은 근본적으로 당신에게 세트 마진을 줄 것입니다. 귀하의 예를 들어 div 또는 section이 마진을 설정하고 싶다고 말할 수는 없으므로 부모 요소에 position: relative을 사용해야합니다.