CSSフレックスボックス/ jquery：自動溝サイズ

Question

私は応答性の高いグリッドリストを作成しようとしています。要素の高さは固定されており（300px）、幅は120pxです。要素間のスペースは自動である必要がありますが、最小サイズは20pxです。

これは私の現在のCSSです：

.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; 
} 

私はこの結果を得た：

Result

をしかし、それはこのようになります必要があります。

It should looks like this

がありますCSSとjQueryを使って本当ですか？

Answer 1

私はあなたがthatを得たかどうかはわかりませんが、私は3つの小さなCSSプロパティ（flex-wrap、justify-content、およびmargin）を追加したとき、私はthisを得ました。それはあなたが探しているものですか？