Skip to content

Instantly share code, notes, and snippets.

@joshbode

joshbode/numbered_headings.md

Last active April 3, 2020 07:46
Show Gist options
  • Save joshbode/491ad0e678d456ea8ddc to your computer and use it in GitHub Desktop.
Save joshbode/491ad0e678d456ea8ddc to your computer and use it in GitHub Desktop.
Download ZIP
Numbered Headings in Markdown via CSS
Raw
numbered_headings.md

World

Country

State

City

Suburb
Street
<style type="text/css"> body { margin: auto; max-width: 44em; font-family: Calibri, sans-serif; font-size: 18pt; } /* automatic heading numbering */ h1 { counter-reset: h2counter; } h2 { counter-reset: h3counter; } h3 { counter-reset: h4counter; } h4 { counter-reset: h5counter; } h5 { counter-reset: h6counter; } h6 { } h2:before { counter-increment: h2counter; content: counter(h2counter) ".\0000a0\0000a0"; } h3:before { counter-increment: h3counter; content: counter(h2counter) "." counter(h3counter) ".\0000a0\0000a0"; } h4:before { counter-increment: h4counter; content: counter(h2counter) "." counter(h3counter) "." counter(h4counter) ".\0000a0\0000a0"; } h5:before { counter-increment: h5counter; content: counter(h2counter) "." counter(h3counter) "." counter(h4counter) "." counter(h5counter) ".\0000a0\0000a0"; } h6:before { counter-increment: h6counter; content: counter(h2counter) "." counter(h3counter) "." counter(h4counter) "." counter(h5counter) "." counter(h6counter) ".\0000a0\0000a0"; } </style>
@hamaluik
Copy link

Just what I needed, thanks!

@zaakiy
Copy link

zaakiy commented May 19, 2017

Two thumbs up. Great work! Thanks!

@nyxee
Copy link

nyxee commented Sep 8, 2017

this worked perfectly for me too.
but, it did not provide h2 heading counter.
I wish you could show an example for comparison.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment