Skip to content

[Bug] Long CJK text in headers overflows/does not wrap in Editor mode when "Show title icons" is enabled #207

@chancewu1104

Description

@chancewu1104

Describe the bug
When "Show title icons" is enabled, long headers containing CJK (Chinese/Japanese/Korean) characters do not wrap correctly in Editor mode. Instead, they overflow the container horizontally.

This happens because CJK languages do not use spaces between words. When the header is converted to a flex container (to display the icon), the browser treats the long CJK string as a single unbreakable word unless word-break: break-all is explicitly applied.

To Reproduce

  1. Enable Iconic plugin.
  2. Go to Settings > Iconic and enable "Show title icons".
  3. Create a note and type a very long header using Chinese characters (without any spaces or punctuation).
  4. Observe that the text does not wrap and overflows the view.

Expected behavior
The header text should wrap to the next line, just like it does when "Show title icons" is disabled.

Screenshots
Image

Environment

  • OS: Windows
  • Obsidian Version: 1.11.5
  • Iconic Plugin Version: 1.18
  • Theme: Minimal Theme (I have tested disabling all other CSS snippets, the issue persists)

Suggested Fix
It seems the header container needs word-break: break-all or overflow-wrap: anywhere to handle CJK text correctly when using flex layout.

Metadata

Metadata

Assignees

Labels

compatibilityConflicts with another plugin or theme

Projects

Status

No status

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions