HTML 페이지 바닥 글을 최소 높이로 페이지 하단에 유지하지만 페이지와 겹치지 않도록하는 CSS

질문 : HTML 페이지 바닥 글을 최소 높이로 페이지 하단에 유지하지만 페이지와 겹치지 않도록하는 CSS

---

다음 페이지 (데드 링크 : http://www.workingstorage.com/Sample.htm )에 페이지 하단에 배치 할 수없는 바닥 글이 있습니다.

바닥 글에

• 페이지가 짧고 화면이 채워지지 않았을 때 창 하단에 붙이십시오.
• 문서 끝에 머무르고 콘텐츠가 겹치는 대신 화면이 많은 콘텐츠가있는 경우 정상적으로 아래로 이동합니다.

CSS가 상속되어 나를 당혹스럽게합니다. 콘텐츠에 최소 높이를 두거나 바닥 글을 맨 아래로 이동하도록 제대로 변경할 수없는 것 같습니다.

답변

---

min-height 를 100% 로 설정하여 본문을 페이지의 100% 로 만드는 것입니다. 바닥 글 높이가 변경되지 않으면 제대로 작동합니다.

바닥 글에 음수 여백을 지정합니다.

footer {
    clear: both;
    position: relative;
    height: 200px;
    margin-top: -200px;
}

출처 : https://stackoverflow.com/questions/643879/css-to-make-html-page-footer-stay-at-bottom-of-the-page-with-a-minimum-height-b