[Preview mode] Adding footnote increases line spacing

Bug reports
, ,
#1

Steps to reproduce

  1. Add a paragraph that wraps over several lines
  2. Add a footnote to the end of it like this ^[my footnote]

Expected result

Line spacing should be the same between all the lines in the paragraph.

Actual result

Line spacing increases on the line with the footnote.

Environment

  • Operating system: Windows 10
  • Obsidian version: 0.6.5
  • Using custom CSS: No

Additional information

Screenshot with added line-spacing highlighted:

image
image1324Ă—241 47.9 KB

4 Likes
#2

I solved this with CSS (I used a modified font without the “^”)

Obsidian_20-06-20-47_668x170

.cm-s-obsidian span.cm-footref {
    display: inline-block;
    font-size: 0.7em;
    vertical-align: text-top;
    font-family: MYB;
    font-size: 12px;
    text-indent: 0px;
    margin: -7px 0px 0 0;
}

.cm-s-obsidian pre.HyperMD-footnote span.cm-hmd-footnote {
    color: var(--text-link);
    cursor: pointer;
    font-family: MYB;
    font-size: 16px;
}
.cm-s-obsidian span.cm-formatting-link, .cm-s-obsidian span.cm-formatting-link-string {
    color: var(--text-link);
    vertical-align: baseline;
    font-size: 10px;
}
#3

The problem as described exactly by @Gnopps persists as of the latest release:

Environment
Obsidian v. 10.0.9 | macOS 10.15.7 | no custom CSS

If I switch to custom CSS, most of them inherit the unwanted increase in leading in the lines with a footnote anchor in the body text. (One that doesn’t seem to is Obsdan-Dark-Rmx.)

The issue is not specific to the last line of a paragraph but occurs in any line of its lines. (See screenshot). When exported as pdf, the disproportionate line-height finds its way into the pdf.

There are likely CSS customisations that would solve this but since it occurs even without any custom CSS it may need to be resolved at a deeper level. Thanks for looking into this.

Page 0001
Page 00014088Ă—2630 804 KB

#4

I also have this problem – any new ideas? Thanks in advance!

#5

This issue is still a thing. I’ve just installed obsidian and tried to solve it with no result.

#6

I came across this issue today… solved with this snippet.

See obsidian-css-snippets/Footnotes.md at master · Dmytro-Shulha/obsidian-css-snippets · GitHub

sup { 
       vertical-align: top; 
       position: relative; 
       top: -0.3em; 
       font-size: 0.75em; 
}
1 Like