[MUI] 그리드 컬럼 헤더 높이 조정

그리드 컬럼 그룹이 일부만 존재하는데도 공간(높이)를 너무 많이 차지해서 높이를 줄여주고 싶었다.

renderHeaderGroup 속성을 통해 높이를 변경해 봤는데 내부 content의 높이만 변경되지 MUI에서 관리하는 컨테이너 높이는 수정되지 않음

 

DataGrid에 속성을 찾아보니까 density라는게 있음 compact로 설정하니까 어느정도 만족스럽다.

기존에 한줄일떄도 컬럼 헤더가 너무 큰 느낌이 있었음

근데 좀... 이상한게 footer는 같이 안줄어든다. 그래서 클래스 덮어써서 높이 줄여줌

footer는 Selected Rows 나오고 페이징 나오는 부분을 말함

https://mui.com/x/api/data-grid/data-grid/#density

DataGrid API - MUI X