완벽한 해결방법은 아니지만,
현 상황을 기준으로, footer가 46px를 차지하고 있으므로 마지막 본문의 article에 margin-bottom: 46px를 적용합니다.
body에 padding-bottom을 주는 방법도 있으나, 잘 먹히지 않아 개발자도구만 보고 간단히 뜯어보기에는 오래걸릴것 같아 한번 연구해보시면 될것 같습니다.
더불어 개별 article 들을 통틀어 상위 div로 묶고, 그 부분에 margin-bottom: 46px를 준다면 더 좋을것 같습니다.
article:nth-last-child() {
margin-bottom: 46px;
}
https://codepen.io/catgarret/pen/yLLqyyG
@김철민 님이 데벨업 퀘스트 및 웹사이트 구조,조작 질문입니다! 에서 보낸 메세지:
웹사이트 구조 답변
웹사이트 구조 2번 답변 속 코드 예시를 잘못 썼네요..ㅎ
코드를 다시 작성해본다면 다음과 같습니다.
<% Post.all.each do |t| %>
<%= image_tag url_for(t.image) %>
<% end %>
그리고 3번 답변도 좀 수정한다면, jquery가 비록 요즘 유행이 멀어진다곤 하나 그래도 여전히 많이쓰이는 만큼 한번 javascript를 심화과정으로 쓴다고 생각하고 간단히 써보는게 어떨까 싶네요 (제 생각 선에서 javascript를 좀 어려운 단계까지 다가간다면 ajax 비동기 통신까지?)
어... 저도 쿠키라고 이해하고 답변드리겠습니다.
-popstate 이벤트
https://developer.mozilla.org/ko/docs/Web/API/Window/popstate_event
-beforeunload 이벤트
https://developer.mozilla.org/ko/docs/Web/Events/beforeunload
두 개 문서 참고하고 사용하시면 될 것 같습니다