Frontend/CSS

[CSS] Table thead sticky & Scrollbar Custom

안녕하세요🙏 개발자 재민콩입니다. 오늘은 thead가 고정된 table과, scrollbar를 custom 하는 방법을 알아보겠습니다! 1. Sticky // 테이블을 감싸는 div영역에 max-height 지정 .table-wrap { max-height: 332px; } .table-wrap table thead { // ie에서는 지원하지 않습니다. position: sticky; // 이부분을 추가해줘야 적용됩니다. top: 0; } 2. Scrollbar Custom // 스크롤 Custom은 지원하지 않는 브라우저가 많음(적용 안될시 기본 스크롤바가 보임) .table-wrap { // ie에서 지원하지 않음 overflow: overlay; &::-webkit-scrollbar { width..