1 つの項目が最初の列の高さ全体にわたる 3 列のグリッド レイアウトを実装します。

Question

CSS で 1 列のコンテンツをオフセットしたいと考えています。以下のようにするだけで簡単だと思います。これにより、上部はオフセットされますが、2 番目の列が最初の列の高さ (マージンを含む) と一致します。最初の列をオフセットするには他にどのようにすればよいでしょうか?

https://jsbin.com/delobaluga/edit?html,css,output

ああああ

Answer 1

2 番目の列の高さに影響を与えずに最初の列をオフセットしたい場合は、最初の列でマージンの代わりにパディングを使用できます。パディングは要素のコンテンツ領域に影響し、マージンは周囲の領域に影響します。そのため、最初の列にパディングを追加すると、そのサイズが増加し、その中のコンテンツがオフセットされますが、2 番目の列の高さには影響しません。 。 p>

これはこれで改善されたコードです:

リーリー