본문 바로가기
> 포트폴리오/wiggle wiggle

[SASS] aside 메뉴 만들기 ( position 사용 )

by 자몽주스 2024. 6. 23.
728x90
반응형

디폴트 값
  position: fixed;
  top: 0; /* 최상단에 위치하도록 설정 */
  left: 0; /* 왼쪽에 위치하도록 설정 */

top: 0과 left: 0을 추가하여 항상 화면의 최상단에 고정되도록 합니다

= 위치를 지정해줘야함. 

position: fixed로 고정하는 이유

position: fixed;를 사용하면 요소가 뷰포트(화면)의 상단을 기준으로 고정됨.

position: relative로 하면 왜 상단고정이 안되는 이유

position: relative;로 설정하면,

요소는 자신의 원래 위치를 기준으로 상대적으로 위치가 조정됨.

 

따라서 top: 0;을 사용하면 원래 위치에서 상단에 고정되지 않고 그 자리에서 이동.

 

728x90
반응형