CSS flexbox/jquery : 자동 도랑 크기

Question

응답 성있는 표 목록을 작성하려고합니다. 요소는 고정 높이 (300px)와 폭 (120px)을가집니다. 요소 사이의 간격은 자동이어야하지만 최소 크기는 20 픽셀이어야합니다.

.folder-list { 
    list-style: none; 
    padding: 0; 
    margin: 0; 
    display: flex; 
    height: 100%; 
    width: 100%; 
} 

.folder-list li { 
    display: block; 
    width: 300px; 
    height: 120px; 
    background: rgba(255, 255, 255, 0.7); 
    flex-shrink: 0; 
} 

나는이 결과를 가지고 :

이 내 현재 CSS입니다

Result

를하지만해야 다음과 같습니다

It should looks like this

거기인가 CSS와 jQuery를 사용하여 진짜야?

Answer 1

난 당신이 that을 얻었는지 모르겠지만, 내가 3 개 작은 CSS 속성 (flex-wrap, justify-content 및 margin)을 추가 할 때, 나는 this을 얻었다. 그게 당신이 찾고있는거야?