css3 - 플렉스 레이아웃에서 하위 요소를 정렬하는 방법은 무엇입니까?

Question

그림과 같이 justify-content:space-around;를 사용하는데, 제가 원하는 것은 자식 요소의 두 번째 행이 첫 번째 행과 상하로 정렬될 수 있다는 것입니다. 어떻게 해결하나요?

Answer 1

justify-content:space-between;

Answer 2

몇 가지 계산이 필요할 수 있습니다.

으아악 으아악

온라인 보기 https://jsfiddle.net/zktf3oc5/

Answer 3

flex 상위 컨테이너의 너비가 가변적이면 레이아웃에서 원하는 효과를 얻을 수 없습니다.

Answer 4

Flex는 주로 아이디어가 규칙을 깨기 때문에 레이아웃을 구현합니다. 가로 레이아웃이 성공하지 못하면 세로 축 레이아웃을 사용하고 각 열은
flex-direction:colomn;
justify-content:space-around;
로 설정됩니다. 합계 3개의 열을 다시 사용하세요
justify-content :space-around;