• webmini life skin Ver 1.3.2 update view
  • 사이트 제작 문의 오랜 경험을 바탕으로 웹퍼블리싱을 해드립니다 제작 문의하기
  • 블로그 리뷰 문의 검색엔진최적화로 제품 리뷰를 해드립니다 리뷰 문의하기

align-self:flex-start;1

728x90
[CSS]부모요소가 display:flex; 일때 사이드 메뉴에 position:sticky; 를 적용해보자 부모요소가 display:flex; 일때 사이드 메뉴가 sticky 로 동작하게 하는 방법입니다.구조는 다음과 같습니다.HTML 컨텐츠 내용 사이드 메뉴(이부분이 position: sticky; 가 동작할 영역) 스크롤 하면 aside 영역이 sticky 가 될 부분입니다. CSS.container{ display:flex;}.contents{ width:calc(100% - 30%); /* aside 영역 만큼 빼줌 */}.aside{ align-self: flex-start; /* 이부분 추가 */ position: sticky; top: 45px; right: 0; width: 30%;} flex 컨테이너 내에서 자식 요소들은 기본..
반응형