CSS でのグリッド レイアウトに少し夢中になっています。私はラッパー (幅 1000px) を持っていて、float:left;それぞれの間に 23px のマージンを持った div を配置したいと考えています。これは、:nth-childセレクターを使用して簡単に実現できます。しかし今、左上隅にテキスト ブロックがあり、その高さは可変で、グリッド アイテムの数も可変です。
そこでright-margin、テキスト ブロックとグリッド アイテムの を 23px に設定しました。しかし、一番右のグリッド要素に 23pxright-marginがあると、次の行に分割されます。
nth-childここでは、2 アイテムが何列、3 アイテムが何列になるかわからないので使用できません。
私の問題に対する CSS のみの解決策があることを願っています。
アップデート
これが私が行った試みを示すフィドルです：jsfiddle.net
これが私のレイアウトです。
+-------------------------------------------+
|+---------------+ +----------+ +----------+|
|| | | | | ||
|| | | | | ||
|| | | | | ||
|| | +----------+ +----------+|
|| Textblock | +----------+ +----------+|
|| | | | | ||
|| | | | | ||
|| | | | | ||
|+---------------+ +----------+ +----------+|
|+----------+ ^ ^ ^|
|| | (margin) (margin) (no margin)
|| | |
|| | |
|+----------+ |
+-------------------------------------------+
^
(no margin)