One more &
Had to do one more round on & (ampersand), but bear with me! Ever styled a markdown document or a long chunk of text? Imagine wanting different spacing between different paragraphs. With the ampersand, you can do it in a heartbeat.
article {
p {
margin: 0;
/* <p> that's after/below an element
that's not <p> like an image */
*:not(&) + & {
margin-top: 24px;
}
/* <p> that's before/above an element that's not <p> */
&:not(:has(+ &)) {
margin-bottom: 24px;
}
/* <p> that's after/below another <p> */
& + & {
margin-top: 12px;
}
}
}
Nice, right!