CSS 넓이에서 스크롤바 크기 제외하기
스크롤바가 생기며 div를 밀어내 좌우 여백이 달라지는 현상 발생, css로 해결
✅ 스크롤 바가 적용되는 요소에 overflow: overlay 를 적용하여 스크롤바를 요소 위에 덮어 씌워 보여준다.
body{
overflow:overlay;
}❗ 해당 옵션은 Webkit(Safari 등)과 Blink(Chrome 또는 Opera 등) 기반 브라우저에만 적용된다는 단점이 있다. (사파리, 크롬 브라우저에서만 해결)
- overlay
auto와 동일하게 동작하지만, 스크롤바가 공간을 차지하는 대신 콘텐츠 위에 위치합니다. Webkit(Safari 등)과 Blink(Chrome 또는 Opera 등) 기반 브라우저만 지원합니다.
✔overflow - MDN
📌 참고자료
https://binarydiver.github.io/blog/programming/180716-scrollbar_size
