要素の余白の取り方

隣接セレクタ

①親要素のpaddingで周囲（上下左右）の余白を取る。
②①の設定では不可能な、子要素間の余白をmargin-topで取る。
同一の要素間の余白を取りたい場合は隣接セレクタを使うのが適切。

.item + .item {
　margin-top: 10px;
}

フクロウセレクタ

:root{
  --flow-space: 1.5em;
}
.stack > * + * {
  margin-block-start: var(--flow-space, 1em);
}

フクロウセレクタ（* + *）を使うことで、.stackのすべての直接の兄弟要素にmargin-block-startが与えられる。さらに>を追加することで、このマージンが再帰的に与えられるのを防ぐ。margin-block-startは論理プロパティで、英語（左から右）でもアラビア語（右から左）のwriting-modeでもマージンは要素の上部に与えられる。