flexbox에서 자식 요소에 width: 100%를 적용하면 두 가지 경우로 너비를 정한다.

• *수평 정렬: 자식 요소가 수평으로 정렬된 경우 width: 100%는 부모의 너비 안에서 자식 요소들을 균등하게 동일한 너비를 가지도록 한다.*
  • *부모 너비는 자식 요소의 내용물의 너비를 합한 크기*
• *수직 정렬: 자식 요소가 수직으로 정렬된 경우 width: 100%는 부모의 너비만큼 너비를 가지도록 한다.*
  • *부모 너비는 자식 요소 중 가장 큰 내용물을 가진 너비의 크기*

.container {
	display: flex;
}

.item1 {
	width: 100%;
}

.item2 {
	width: 100%;
}

.container {
	display: flex;
	flex-direction: column;
}

.item1 {
	width: 100%;
}

.item2 {
	width: 100%;
}