改修案を拝見しましたが、他の環境(特にPCとタブレット)で余白が大きい&アイコンが小さすぎるように感じたので調整してみました。案2
各環境でのレイアウトは以下のような感じです。
・スマホ(横360px~): 縦積みレイアウト。1行に5キャラ、412~で6キャラ
・タブレット(横~821px): 縦積みレイアウト。768pxで1行に12キャラ
・タブレットだとギリギリ認識されないタブレット(横822px~): 横並びレイアウト。1行に4キャラ、875~で1行に5キャラ
・デスクトップ: 横並びレイアウト。1024で1行に6キャラ、1280pxで1行に8キャラ
また、以下のサイトをみると横822~のタブレットは非常にシェアが少ないのである程度は我慢していただきたいです。
https://docodoor.co.jp/staffblog/breakpoint-responsive/
通報 ...