Vertically align callout titles that use markdown headers

Share & showcase
1

I use markdown headers in my callout titles sometimes, and the icon and the title text become unaligned. Here’s a snippet to fix that. It does a very tiny thing:

  • Vertically center-align callout titles that use markdown headers.

BEFORE: Here’s the default behavior in the default theme.

unaligned-callout-header-titles
unaligned-callout-header-titles1859×898 98.3 KB

AFTER: Here’s the new behavior in the default theme.

aligned-callout-header-titles
aligned-callout-header-titles1854×906 100 KB

Steps to get it going

  1. Download it.
  2. Put it in your snippets folder (within the .Obsidian folder)
  3. Go to Obsidian > Settings > Appearance
  4. Scroll to the bottom, refresh the snippets.
  5. Toggle on aligned-callout-header-titles

You can download the code on github here to get it going:

Enjoy,
Nick

PS: I hope Obsidian just adds this eventually. Fingers crossed.

5 Likes
2

This is great Nick, I’ve been hoping someone would create a fix for this since I’ve started using Obsidian 6mths ago. Satisfies my OCD =D
Cheers

2 Likes
3

Thanks for the feedback, happy it’s useful.