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

column-count 레이아웃 나누기

by 닐기 2021. 9. 29.

See the Pen column-count by nilgi (@nilgi) on CodePen.

 

• column-count: 3; // 칸 수
• column-gap: 50px; // 칸 간격


• column-rule-style: solid; // 칸 사이 줄
• column-rule-width: 1px; // 줄 굵기
• column-rule-color: tomato; // 줄 색

• column-rule: 4px solid #1E90FF; // 줄 속기(border와 쓰는 방법 같음)

 

• column-span: all; // 레이아웃에서 제외(레이아웃 전체에 적용)
• column-width: 100px; // 칸 크기 지정