Live Preview: Punctuation Marks after words that are bold/highlighted or after links gets pushed to next line

This occurs in the Help Vault as well. When you’ve got Live Preview mode on, the punctuation marks (periods, commas, etc.) sometimes get pushed to the next line, if the word that is bold or highlit is at the end of the previous line.
Normally you’d expect the comma or period to be part of that previous line because there’s no space. I assume the live preview and the switching back and forth between showing the asterisks or equal signs mess with that.

Steps to reproduce

  1. have word that is “modified” through bold or italics or highlighting
  2. have that word at the end of a line, followed by a punctuation mark . or ,
  3. see that that symbol gets pushed to the next line.
  4. when you click on the word, the symbols (* or =) are shown and then the whole is usually moved to the next line.
  5. when you click out of that word, those symbols disappear, and the word moves up a line, but the punctuation mark stays on that line.

Expected result

punctuation mark should remain with the previous word in previous line

Actual result

punctuation mark is on its own in the next line

Environment

  • Operating system: Linux Mint
  • Debug info:
    SYSTEM INFO:
    Obsidian version: v0.13.23
    Installer version: v0.12.15
    Operating system: #29~20.04.1-Ubuntu SMP Fri Jan 14 00:32:30 UTC 2022 5.13.0-27-generic
    Login status: not logged in
    Insider build toggle: off
    Live preview: on
    Legacy editor: off
    Base theme: dark
    Community theme: none
    Snippets enabled: 0
    Safe mode: on

RECOMMENDATIONS:
none


Additional information

image

10 Likes

Steps to reproduce

  1. Write a text that’s long enough so it breaks in multiple lines.
  2. Put a comma in a word near the end of one line.
  3. Set the comma’s preceding word to italics.

Expected result

The comma should appear in the first line, or move the word (in italics) and the comma to the following line.

Actual result

The comma appears alone in a new line, like this:
image

Environment

  • Operating system: Windows 11
  • Debug info:
    SYSTEM INFO:
    Obsidian version: v0.13.23
    Installer version: v0.12.15
    Operating system: Windows 10 Pro 10.0.22000
    Login status: not logged in
    Insider build toggle: off
    Live preview: on
    Legacy editor: off
    Base theme: light
    Community theme: none
    Snippets enabled: 5
    Safe mode: off
    Plugins installed: 12
    Plugins enabled: 10
    1: Better Word Count
    2: Tidy Footnotes
    3: Footnote Shortcut
    4: Icon Folder
    5: Imgur Plugin
    6: Citations
    7: Minimal Theme Settings
    8: Emoji Toolbar
    9: Calendar
    10: Day Planner
1 Like

I’ve noticed it also occurs when a bracket is followed by a math formula:

image

2 Likes

Seems to happen after code blocks too.

Steps to reproduce

Blaghaslkjdhfl kasjdhfl kajsdfhl ksjk adsdhjsfl kjshdfkl jshdf lkjsaflkjhksf  [smooth jazz cover](https://www.youtube.com/watch?v=JHjb-oN-IA8&ab_channel=036MALUKU),

Expected result

I expect the comma to stay with the link, but it is broken onto the next line, which starts with a comma.

This only happens if the link is external and it renders the box and arrow glyph after the link. Internal links are not affected.

Actual result

Screenshot:

Environment

  • Operating system:
    OS X Catalina
  • Debug info:
    SYSTEM INFO:
    Obsidian version: v0.14.6
    Installer version: v0.14.6
    Operating system: Darwin Kernel Version 19.6.0: Tue Feb 15 21:39:11 PST 2022; root:xnu-6153.141.59~1/RELEASE_X86_64 19.6.0
    Login status: logged in
    Catalyst license: none
    Insider build toggle: off
    Live preview: on
    Legacy editor: off
    Base theme: dark
    Community theme: none
    Snippets enabled: 0
    Safe mode: off
    Plugins installed: 1
    Plugins enabled: 1
    1: Obsidian Charts

RECOMMENDATIONS:
Community plugins: for bugs, please first try updating all your plugins to latest. If still not fixed, please try to make the issue happen in the help vault or disable community plugins.


Additional information

2 Likes

I haven’t tested it everywhere, but at first glance this css snippet seems to fix the issue:

.markdown-source-view.mod-cm6 img.cm-widgetBuffer  {
	display: none !important;
}

Steps to reproduce

  1. Create an external hyperlink (not tested with internal links)
  2. Put quotes around the link, like "[Obsidian](https://obsidian.md/)"
  3. Write just enough text before the link so that the link drops to the next line.

Expected result

In reading and Source view, the leading quote mark drops down to the next line. In Live Preview, it does not. This is very annoying, because it leaves me assuming I left a space between the quote mark and the opening bracket.

Actual result

The quote mark is left orphaned on the previous line, like this:

Environment

  • Operating system: iPadOS
  • Debug info:

SYSTEM INFO:
Operating system: ios 15.6.1 (Apple iPad)
Obsidian version: 1.3.1 (67)
API version: v0.15.9
Login status: not logged in
Live preview: on
Legacy editor: off
Base theme: light
Community theme: none
Snippets enabled: 1
Restricted mode: on

RECOMMENDATIONS:
Custom theme: for cosmetic issues, please first try updating your theme to latest. If still not fixed, please try to make the issue happen in the Sandbox Vault or disable community theme and snippets.


Additional information

1 Like

Steps to reproduce

Use:

Focusing is a higher-level function than [[Concentration|concentration]], but focusing on a particular task *requires* [[Concentration|concentration]].

Expected result

Output text ...function than concentration, should appear as seen. Punctuation character should always remained joined to the end of the preceding string. User should never include it inside the wikilink reference. Parsing system should consider concentration, part of the same entity for determining wrapping.

Actual result

When a comma follows a wikilink closure and the window width bumps up against it, it is wrongly wrapped to the next line and appears as an orphan.

Environment

  • Operating system: macOS 12.2.1
  • Obsidian: 1.0.0
  • Theme: Default
  • Debug info:
SYSTEM INFO:
	Obsidian version: v1.0.0
	Installer version: v0.15.9
	Operating system: Darwin Kernel Version 21.3.0: Wed Jan  5 21:37:58 PST 2022; root:xnu-8019.80.24~20/RELEASE_X86_64 21.3.0
	Login status: logged in
	Catalyst license: insider
	Insider build toggle: on
	Live preview: on
	Legacy editor: off
	Base theme: light
	Community theme: none
	Snippets enabled: 2
	Restricted mode: off
	Plugins installed: 28
	Plugins enabled: 7
		1: Paste URL into selection v1.7.0
		2: Simple Embeds v1.12.0
		3: Linter v1.5.1
		4: Raindrop Highlights v0.0.14
		5: Tasks v1.15.0
		6: Obsidian42 - BRAT v0.6.35
		7: Natural Language Dates v0.6.1

RECOMMENDATIONS:
	Custom theme and snippets: for cosmetic issues, please first try updating your theme and disabling your snippets. If still not fixed, please try to make the issue happen in the Sandbox Vault or disable community theme and snippets.
	Community plugins: for bugs, please first try updating all your plugins to latest. If still not fixed, please try to make the issue happen in the Sandbox Vault or disable community plugins.


Additional information

Yes, it does indeed. Many thanks.

2 Likes

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.

This does not seem to fix the issue between inline math and punctuation. E.g., I get a line break between “$A$” and a subsequent closing parenthesis (with no space between them).

1 Like

Also this just seems worth fixing in general? Can the snippet be incorporated into releases or similar rather than us individually adding it?

(Aussi ça marche et merci Maxime! Je sais un Maxime qui a pris le M.Des. à Concordia - c’est pas toi, non?)

Can confirm this behavior still occurs in v1.5.3 in sandbox vault.

I’m also seeing periods wrapping to a new line when immediately after an inline code snippet

image

The css snippet up thread makes code blocks render at a shorter height in addition to fixing the text wrap issue. On long code blocks, the language overlaps with the code.

Without Snippet:
image

With Snippet:
image

Steps to reproduce

In the vault sandbox, type a short sentence that ends in italicized words, *like this*. The period at the end of the sentence should not be italicized. Now pad the start of the line with additional characters and/or resize the window until the line starts to wrap. Under certain spacing conditions, the period will wrap onto its own line, leaving it orphaned from the final words in the sentence.

Did you follow the troubleshooting guide? [Y/N]

Yes! I searched around and can’t seem to find an existing report for this.

Expected result

The period should “keep” with the words that preceded it, regardless of punctuation. In fact, if you switch to reading mode, the sentence will wrap correctly – but the presence of the hidden asterisk between the final word and the period in Live Preview seems to cause this unsightly form of wrapping to be possible.

live preview:

reading mode:

Actual result

The period will be “orphaned” onto its own line, something that most word processing software and most rich text editors prevent.

Environment

SYSTEM INFO:
	Obsidian version: v1.5.3
	Installer version: v1.5.3
	Operating system: #40~22.04.1-Ubuntu
	Login status: not logged in
	Insider build toggle: off
	Live preview: on
	Base theme: adapt to system
	Community theme: none
	Snippets enabled: 0
	Restricted mode: on

RECOMMENDATIONS:
	none

I can reproduce this on Fedora 39 with the v1.5.3 appimage. This happens in edit mode only: in reading mode, the wrapping occurs correctly.