行内代码过长时奇怪的断行渲染方式

@Vanessa 这个没办法改进吗？

这是个已知问题，请参考 Issue #8104 · siyuan-note/siyuan

默认主题

、

自定义代码

.b3-typography code:not(.hljs),
.b3-typography span[data-type~='code'],
.protyle-wysiwyg code:not(.hljs),
.protyle-wysiwyg span[data-type~='code'] {

    word-break: break-all;

}

@88250 用 word-break: break-all;就能解决这个问题，只不过不会按单词分割，但是我觉得行内代码本身就有底纹，不按单词分割也没什么，是可以明确知道上一行和下一行有没有空格的，不会造成歧义，我自己使用过程中没发现过有所影响。类似的还有超链接。

正文要 break-word 我能理解，但像这种特殊样式，本身就可以靠格式独立出来，break-all 的体验更好其实，我自己用的 Tsundoku 主题就一直用的 break-all。

break-word 反而有时候会莫名奇妙的分行看的还不舒服。因为本身 inline-code、inline-hyperlink，就是行内元素，预期用户输入的就是单行文字，反而因为 break-word 被分割渲染看起来变成了多行。另外，break-word 也不能保证一定按单词分割，行内代码除了代码之外，另一个广泛的用法就是放路径了，对于一般没有空格的长路径，可是直接识别成一个单词的，这时候效果就会很不好，直接前面断了一行。（notion 之类的是不支持直接编辑行内代码左侧，所以问题不太大，而语雀用的就是 break-all）

虽然主题\自定义代码可以做到，不过建议官方考虑一下能否采用这种方案，我是觉得适用于大多数人的，不至于让普通用户困惑。其他用户如果不喜欢 break-all，也可以自定义代码实现 break-word

@Vanessa

超链接应该还是不行，超链接的锚文本不一定是链接本身

不过换句话说，如果能判断超链接的锚文本是链接本身就行了

break all 和 break-word 在中文场景下区别不大，英文场景下才有区别。我之前之所以给主题的超链接加 break-all，主要是因为也是有行内代码的问题，如果一个链接的长锚文本被识别一个单词，就会直接与普通文本分行，特别难受。

如果是普通段落，其实 break-word 就还可以。

我试了下好像不行，还是会有残留的零宽字符在上面。单词被隔断看着很不舒服。

这个是正好行内代码就在行末尾导致的的吧，应该情况比较少，大家遇到的残留零宽字符更多是在句子中间就被 break word 打断了，非常突兀。我觉得行内代码主要用来标记代码和路径以及数字、字符串，而不是一个长段落，被打断对我而言无所谓，我也更倾向于渲染效果比较规整的结果，一行只有一半就自动换行反而是一件更受不了的事情。如果行内代码的内容没有空格的话，break word 一般都是把整体看成一个单词的，导致过长就直接分行了。

语雀貌似不会有这个问题，不知道怎么实现的。此外语雀的行内代码就是用的 break all，我把它改成 break word，昨天测试的时候并没有发现残留零宽字符

即便行内代码不在末尾也会有这个问题 😂 。

楼主中的图片和 issue 中说的应该是残留问题，这个调整编辑器宽度应该可以重现。代码里面大部分都是英文，截断感觉会影响阅读。

另外也不光是残留的问题，虽然调整宽度可以避免断行，但是在屏幕大小限制（比如移动端），或者需要导出 pdf 时很影响排版美观。😭

我看了下语雀的 DOM 结构，发现语雀的零宽字符是单独用 span 标签包裹的

而使用的零宽字符直接就放在了内容的最左侧

估计是这个原因，break-word 识别零宽字符是一个单词，后面的长字符串为一个单词，然后就被分割了。不知道思源有没有办法改进下。

我发现估计是使用的零宽字符的缘故，V 姐试试改用语雀的那种零宽字符，我直接在 DOM 改零宽字符貌似就没有出现残留了！

@Vanessa

修改语雀 DOM 用思源的零宽字符，也会出现这个问题

思源改之前

改之后

确实就不会在上一行残留一点点背景了，但是貌似发现了一个缺点——下一行好像会多一个字，语雀由于是 break-all 就没有这个问题

大佬牛批，感谢大佬！

感觉改零宽字符是个办法。

我发现在设置里面把两侧对齐打开就会好一些，也可以避免行内代码截断（缺点就是字少的时候一行会很稀疏）。另外就是会有一点背景残留，但是改为 @Achuan-2 说的那种零宽字符后，就不会有残留了，确实是个可行的办法。

在官方没改进之前，你可以尝试用我的 Tsundoku 主题，主题对行内代码设置了 break all 的，如果不在意分割单词的话

感谢！已经用上了你前面的代码片段，哈哈

ok，不客气