justify-content와 align-items의 차이는?

justify-content는 주축을 따른 정렬을 제어합니다. align-items는 교차축을 따른 정렬을 제어합니다.

Flexbox로 요소를 중앙 정렬하려면?

부모 요소에 display: flex; justify-content: center; align-items: center;를 설정합니다.

무료 온라인 Flexbox 레이아웃 에디터, 시각적 실시간 미리보기

속성

방향

주축 정렬

교차축 정렬

줄바꿈

간격8px

항목3

CSS

display: flex;
flex-direction: row;
justify-content: flex-start;
align-items: stretch;
flex-wrap: nowrap;
gap: 8px;

이 도구가 도움이 되었다면, 개발자에게 커피 한 잔을 사주세요.