Reminder that negative margins and paddings in CSS are a thing, and are quite useful. Some of my favourite uses follow.
More space between document sections:
h1, h2, h3, h4, h5, h6 { margin: 2rem 0 -0.5rem;}When viewport width is small (mobile, etc.), <pre> stretches to the walls, and it’s content is aligned with the rest of the document’s text:
pre { margin: 0 -0.5rem; padding: 0.25rem 0.5rem;}
Follow
Another recent example.
Indent all but the first line of your paragraphs. This is useful when you have long lines which, when wrapped, become hard to dicern. It’s like a cross between a description list (<dl>) and a list (<ul>).
p {padding-left:2rem; margin:0; text-indent:-1rem}Also, use <dl> and
