본문의 컨텐츠가 짧을 경우; 바닥글은 뷰포트 하단에 고정된다. 반면, 페이지의 컨텐츠가 뷰포트 하단을 넘어서까지 확장되면; 바닥글은 컨텐츠 아래에 배치되고, 스크롤 시 나타난다!

            
                html { height: 100%; }
                body { height: 100%; padding: 0; margin: 0; }
                
                .wrapper {
                    min-height: 100%;
                    display: grid;
                    grid-template-rows: auto 1fr auto; /* 1fr은 남는 공간 모두를 차지한다! */
                }
                
                .page-header, .page-footer {
                    padding: 1em; color: #fff; background-color: rgb(75 70 74 / 0.5);
                }