stick to the bottom!

YEONGHUN KO·2024년 10월 15일
0

CSS/SCSS - BASICS

목록 보기
13/13

footer가 div의 바로 아래에 위치한다. 그래서 div의 높이가 화면보다 작으면 footer가 화면 바닥보다 위에 위치할 수 있다. 그래서 화면에 stick하게 하려면 div의 최소높이에 limit를 걸어주어라!


<main className="hideScroll absolute right-[80px] h-screen w-[390px] overflow-auto bg-[#E7F2F8] max-md:relative max-md:right-0">
        <header className="fixed top-0 z-10 flex h-[60px] w-[390px] justify-center bg-white">
          <Image src={budifyLogo} width={120} height={60} alt="budify-logo" />
        </header>
        <div className="mt-[60px] min-h-[90vh] p-[20px]">
          
        </div>
        <footer className="sticky bottom-[0px] h-[80px] w-full bg-white"></footer>
      </main>
profile
'과연 이게 최선일까?' 끊임없이 생각하기

0개의 댓글