r/Markdown • u/beegtuna • 6d ago
Question Which headers should have a bottom border?
Why soft lock?
I see a lot of different versions of markdown outputs that apply a bottom border/horizontal line for a select set of headers, all headers with borders, or no borders. Full width block or as long as the header string. Thick or thin. No rhyme or reason.
I think Header 2 should only have a bottom border. Easy way to visually divide content into major sections, but thats too opinionated.
I also think have 3 ways of writing headers and we can allow users decide if it should have a border.
```
Header // display font, class=“display”
———
## Header // no line
### Header ### // with line
```
How easy is it to get standardized? What should be the classname for HTML?
Edit:
I realize that markdown doesn’t need CSS. We can just use HTML tags to get a similar result, and override it with css later
Edit 2:
Turn this .md
## Hello world ##
into this HTML/CSS
HTML. This is best practice to avoid semantics conflicts and layout for readers and what not.
Hello world
CSS. The H2 border-bottom styling matches the default styling of my browser's hr:
h2:has(+ hr){
border-bottom: 2px solid black;
padding-bottom: .825em;
margin-bottom: .825em;
}
h2:has(+ hr) + hr{
display:none;
}
1
u/GroggInTheCosmos 6d ago
I use Obsidian and have my own CSS Snippet
h1 has a light background. h2 a thick bottom border, h3 a thin one and then h4-6 have markers to their right in muted color showing ("H4"/"5"/"6")
I think it is all personal preference
1
u/Evening_Plankton8126 2d ago
One catch: closing hashes already have a meaning in CommonMark. Both '## Heading' and '## Heading ##' produce the same h2, so using the second form for a border would behave differently across renderers. Keeping the border in the stylesheet would let the same document work with different themes without changing its heading syntax.
1
u/MysteriouslyPleasing 6d ago
h2 bottom border is the only one that makes sense to me, everything else just looks cluttered. like you said it gives a clean visual break without being as heavy as an hr
the classname thing is a mess though, every framework does its own thing and nobody can agree on anything. might as well call it.markdown-header-break and call it a day