横並びブロック アンド グループ
横並びブロックのレスポンシブ対応のチェック。
段落
段落
段落
段落
段落
段落
ブロックに背景を付けると、1.25, 2.375emのパディグが付く。basisなどの指定なし。
nowrapのため、数が増えると、レイアウトが崩れる。
段落2つを単にグループ化
段落
横並びの方がシンプルに枠一つで囲むだけ、グループの方は枠に中に更にインナーがあり、モア形式一覧では縦並びだが、シングル表示では横に並んでいる。スタイルはグリッドになっているようだ。
横並びの中に、縦並びをいれるしか無いかも。
段落1
段落2
段落3
段落4
1,2 及び 3,4 を縦並びにし、両者を横並びにしたもの。枠はシンプルに縦並び用と横並び用の2つだけ。
段落
段落
段落
段落
段落
段落
段落
段落
段落
配置を「項目の間隔」(意味不明)にし、「複数行に折り返す」にするとエディタ上では9個目、フロント画面では7個目から2行目に。
個々のブロックのflexは初期値の0 1 autoらしい。ギャップが、0.5emになると、右から順に次の行に行く。importantしているわでも無いので、flexの追加指定で、使えるようになるかも知れないが、2行目を左寄せにしたり、ブロック幅を同じにするならグリッドの方が良いかも知れない。下のサンプルは、この下に、カスタムHTMLでスタイルを指定してある。エディタ上ではスタイルは効いていない。外部CSS+クラス指定が必要と思える。
.wp-block-group__inner-container{ display:grid;gap:1em; grid-template-columns: repeat(auto-fill, 10em);color:red; }段落
段落
段落
段落