Spacing Prose with CSS

If anything looks wrong, read on the site! While watching this Kevin Powell video (starting at 4:15), I found out about a really cool CSS pattern for styling prose (as in article text, just like what you’re reading right now). More specifically, it’s about defining the space between items. It’s based on Tailwind’s “prose” styling and uses the lobotomized owl selector (* + *). [!info] The Lobotomized Owl 🦉 The name was introduced by Heydon Pickering back in 2014, and it’s an awesome name for a very straightforward selector. The lobotomized owl (* + *) will select any element that is not the first, which makes it basically the same as *:not(:first-child). The Prose Let’s assume we have a blog post that has its content rendered like this: <div class="prose"> <h2>Lorem ipsum dolor</h2> <p>Ad officia consequat pariatur.</p> <p>Mollit eu anim qui qui et labore sit tempor sit.</p> <h2>Fugiat laboris esse mollit</h2> <p>Ad ipsum dolore laboris nisi</p> </div> How would you control the spacing…