728x90 300x250 SMALL css flex코딩1 flex-grow 사용법 flex-grow는 0보다 큰 값을 세팅하면 Flexible 박스로 변하면서 남은 여백을 메우는 속성입니다. .item { display: flex; background: rgba(45, 183, 20, 0.5); flex-direction: column; justify-content: center; align-items: center; flex-basis: 10rem; flex-grow: 1; /* flex-grow 속성추가*/ } 그래서 flex-grow:1;을 추가하면 아래처럼 빈 여백 공간이 채워지게 됩니다. 이때 여백 비율을 각각 다르게 설정할 수 있는데요 .item:nth-child(1) { flex-grow:1; } .item:nth-child(2) { flex-grow:2; } .item:.. 2021. 11. 5. 이전 1 다음 728x90 반응형 LIST