横並びブロック アンド グループ

横並びブロックのレスポンシブ対応のチェック。

ブロックに背景を付けると、1.25, 2.375emのパディグが付く。basisなどの指定なし。
nowrapのため、数が増えると、レイアウトが崩れる。

横並びの方がシンプルに枠一つで囲むだけ、グループの方は枠に中に更にインナーがあり、モア形式一覧では縦並びだが、シングル表示では横に並んでいる。スタイルはグリッドになっているようだ。

横並びの中に、縦並びをいれるしか無いかも。

１，２ 及び 3,4 を縦並びにし、両者を横並びにしたもの。枠はシンプルに縦並び用と横並び用の２つだけ。

配置を「項目の間隔」（意味不明）にし、「複数行に折り返す」にするとエディタ上では９個目、フロント画面では７個目から２行目に。

個々のブロックのflexは初期値の0 1 autoらしい。ギャップが、0.5emになると、右から順に次の行に行く。importantしているわでも無いので、flexの追加指定で、使えるようになるかも知れないが、２行目を左寄せにしたり、ブロック幅を同じにするならグリッドの方が良いかも知れない。下のサンプルは、この下に、カスタムHTMLでスタイルを指定してある。エディタ上ではスタイルは効いていない。外部CSS＋クラス指定が必要と思える。

掲載日時： 2022年6月1日(水) 13:01