본문 바로가기
웹코딩 배우기/· CSS

flex-wrap 아이템 래핑 정렬

by 닐기 2021. 10. 6.

See the Pen flex-wrap by nilgi (@nilgi) on CodePen.

 

display: flex;
• flex-wrap: nowrap; / 기본값.
• flex-wrap: wrap; / 아이템을 래핑하여 크기를 유지하고 창 사이즈에 따라 위에서부터 차례로 정렬
• flex-wrap: wrap-reverse; / wrap의 반대 방향으로 정렬

반응형 웹페이지를 만들 때 유용.