flex-grow 스타일이 제대로 먹지 않는 것 같은데 이유 아시는 분 계실까요?

문제는 ' flex-grow '가 제대로 작동하고 있지만, 버튼의 텍스트 길이에 따라 버튼의 최소 너비가 달라져서 원하는 결과를 얻지 못하고 있습니다. 이를 해결하려면 ' flex-child ' 클래스에 ' flex-basis ' 속성을 ' 0 '으로 설정해야 합니다. 아래와 같이 스타일을 수정하세요: ' flex-basis: 0; '을 추가하면, 모든 자식 요소가 동일한 공간을 차지하게 됩니다. 이렇게 하면 텍스트 길이에 상관없이 모든 버튼의 너비가 균일하게 늘어납니다.

1
2
3
4
.flex-child {
  flex-grow: 1;
  flex-basis: 0;
}