html css로 footer 하단에 고정하기

footer를 하단에 고정하는 방법을 검색하면 여러가지 방법이 나오는데

테스트 해본 결과로 이 방법이 제일 좋은것 같다.

footer를 absolute로 주는 방법!!

예제소스보러가기!!

0311 내용 추가) 직접 작업해보니 생각해봐야 할 부분이 있다.

1. 이 코드에서는 #content가 position:absolute 면 안된다.

   position은 header와 footer에만 사용하고 content는 default로 가는게 좋다.

   어쩔수 없이 content에 position을 사용해야 한다면 absolute와 relative 2개의 클래스를 만들고 작업하는게 좋을듯 하다.

   그리고 content가 absolute일때는 이 방법이 아닌 다른 방법으로 footer를 붙여야 한다.

2. #content와 #footer 사이에 여백 주기가 힘들다면 (이미 작업을 마쳤는데 수정해야할때 등의 경우)

   #footer에 bottom:-100px;로 사이 여백을 주자.

   수치는 디자인에 맞게 맞춘 후 bottom이 기준이므로 -로 줘야 한다.

   -로 주지 않으면 bottom(아래)에서 100만큼 위로 올라가게 된다.

   

자세한 설명은 이곳에서 :

http://www.cssreset.com/how-to-keep-footer-at-bottom-of-page-with-css/