reaeat minmax 썸네일형 리스트형 [반응형 CSS] @media 쿼리, repeat auto-fit 이번 포스트에서는 최근 CSS Grid 레이아웃에서 자주 언급되는 auto-fit과 auto-fill의 차이점, minmax() 함수의 활용법, 그리고 미디어 쿼리 분기점 설정 시의 모범 사례에 대해 알아보겠습니다.1. auto-fit과 auto-fill의 차이점CSS Grid에서 repeat() 함수와 함께 사용되는 auto-fit과 auto-fill은 유사해 보이지만, 동작 방식에 차이가 있습니다.auto-fill: 그리드 컨테이너의 가용 공간에 맞춰 가능한 많은 열을 생성합니다. 남는 공간이 있더라도 빈 열을 유지하며, 콘텐츠가 없는 빈 셀을 생성합니다.auto-fit: auto-fill과 유사하게 가능한 많은 열을 생성하지만, 남는 공간이 있을 경우 빈 열을 제거하고, 기존의 셀이 그 공간을 채우.. 더보기 이전 1 다음