대량 데이터를 테이블에 적용하면서 헤더를 고정 시켜야 사용성이 편해져 헤더를 고정하는 방법을 알아보았다.
position: sticky
position: sticky를 활용하면 테이블이 가로스크롤에 대해서는 자연스럽게 스크롤되면서 세로스크롤에서는 헤더가 고정이 된다.
See the Pen table thead fix by pminsun (@pminsun) on CodePen.
'Css' 카테고리의 다른 글
| Next.js :: module.css (0) | 2024.09.11 |
|---|---|
| twin.macro 사용법 (0) | 2024.09.03 |
| scroll guide (0) | 2024.08.27 |
| 웹 디바이스 별 해상도 반응형 분기점 (0) | 2024.08.26 |
| input checkbox custom (0) | 2024.08.26 |
