Tag Archives: scrollbar

[react/mui] 모달(modal) 호출시 스크롤바가 사라졌다가, 모달을 닫으면 다시 생기는 문제로 인해(jumping scrollbar) 화면이 흔들리는 이슈

By | 4월 18, 2023

환경 react 18 @mui/material: 5.11.2 @mui/base의 Modal 컴포넌트를 사용하여 모달 구현 개요 mui의 데모 페이지에서는 모달이 뜬다고 해서 이런 현상이 발생하지 않았다. 우리 사이트의 레이아웃 특성상 발생하는 문제인 것 같다. 헤더(GNB) 영역이 좌우로 왔다갔다 하는 것이 눈에 거슬림 해결 /** * jumping scrollbar issue 해결방안 * * 1) 모달이 뜨면 스크롤바가 사라지면서 header부가 우측으로 밀리고,… Read More »

[css] 스크롤바(scrollbar) 모양(design, 디자인) 조정하는 샘플코드 (custom…)

By | 9월 16, 2022

/* * 스크롤바 디자인 커스텀하는 코드 * * – 일단 antd table 내의 스크롤바를 가공해 보았음 * – webkit 계열에서만 사용할 수 있다고 함. */ /* 스크롤바 폭 */ .ant-table-body::-webkit-scrollbar { width: 8px; /* 여기서 height가 의미가 있나? */ } /* 스크롤바에서 움직이는 부분 */ .ant-table-body::-webkit-scrollbar-thumb { border: 3px solid transparent; border-radius: 2px; background-color: #bbb;… Read More »