본문으로 건너뛰기

너비

레이아웃은 w-full로 채우고 max-w-*로 가독 폭을 제한한다. 고정 너비는 간격과 같은 4px 스케일.

레이아웃 너비

w-full
100%

부모를 가득 채움. 가장 흔한 기본값.

min-w-0
0

flex 자식이 truncate 되게 하는 필수 트릭(기본 min-width:auto 해제).

w-fit
fit-content

내용 크기만큼만.

min-w-0 은 자주 막히는 함정: flex 안에서 truncate가 안 먹으면 부모에 이걸 준다.

콘텐츠 최대 너비 · max-width

max-w-sm
384px

좁은 카드·다이얼로그·폼.

max-w-md
448px

표준 카드·모달.

max-w-lg
512px

큰 모달.

max-w-2xl
672px

본문 한 컬럼(가독 폭).

max-w-3xl
768px

넓은 본문·문서 컬럼.

본문은 max-w-2xl(≈672px) 안으로: 한 줄이 너무 길면 읽기 어렵다. 고정 픽셀 너비는 w-56(사이드바) 처럼 4px 스케일을 그대로 쓴다.