CSSグリッドフレームワークの溝のポイントは何ですか？

Question

私はWeb開発を夢中にしています。グリッドシステムを含むBlueprint CSSフレームワークで遊んでいます。いくつか質問があります。

1. 溝のポイントは何ですか？確かに余白のCSSプロパティを使うことができるので、列間にスペースを含めるのには使用されません。それとも、余計にマージンを管理するためのエレガントな方法ですか？
2. 私は自分の列の間にスペースを入れたくないし、溝を含まないグリッドレイアウトを生成したいと思いますが、すべてのジェネレータツールでゼロ幅の溝ができなくなります。何故ですか？
3. the suggested Blueprint CSS generatorはサポートされなくなりました。誰もゼロ幅溝を含むようにグリッドを修正するためのBlueprint CSSジェネレータを提案できますか？

あなたの知恵に感謝します！

Answer 1

CSSグリッドシステムの背景は、レイアウトを完全に自動化することです。グリッターは通常、列間の空白が見やすくなるため、オートメーションの一部としてそれらを含めることが理にかなっているので望ましいです。

ジェネレータの立場は、それらを実装するのに必要なわずかな退屈な計算を軽減することですが、ざらざらとした計算がなくても、複雑ではありません。

ジェネレータなしでノーガターグリッドを行うのは非常に簡単です。例えば

(column width X nº of columns) + left margin + right margin = content width 

.span-1 {width:100px} 
.span-2 {width:200px} 
.span-3 {width:300px} 
.span-4 {width:400px} 

etc... 

Answer 2

グッタは、CSS自体とはまったく関係ありません。それらは印刷出版のデザインコンセプトです。列間に空白を入れ、内容を読みやすくします。

排水溝がない列は計算が非常に簡単です。ピクセル単位で各列に同じ幅を設定するだけです。