如何使一個div內的div的柔性顯示

Question

我想知道是否有任何方法可以製作一個flex div，其中包含一些小div，具有固定的寬度和高度，具體取決於用戶。這意味着有些用戶可能沒有div顯示，有些用戶可能有一百個div顯示。

我想知道是否有人有一個想法，如何使這些subdivs種類的主div內的理由，取決於subdivs的數量和屏幕的寬度（例如，寬屏幕的用戶可以有就像每行10個細分單元一樣，手機上的某個人每行應該看到1或2個項目）。

我知道我可以用硬編碼來響應，但是有沒有什麼辦法讓智能和乾淨的CSS代碼滿足我的期望？

Answer 1

嘗試柔性包裝特性 - flex-wrap: wrap;

https://jsfiddle.net/kozleek/w86qq9tt/6/

Answer 2

可以這樣做，也許可以使用其寬度尺寸爲％的細分，例如.subdiv {width：20％;身高：你選擇大小;}。通過放置屬性FLEX-WRAP，細分將水平分佈的方式將根據屏幕大小而有所不同。如果你真的想要使用固定的尺寸（寬度）的細分，必須有必要在你的CSS上進行媒體查詢。我希望它能幫助你。