Allow code blocks to be wider than the normal text

When you add a wide code block Obsidian wraps the content to match the line length when “Readable Line Length” is activated.
This makes it hard to read the code.
A nicer way would be to provide a scroll bar underneath the code block and let it keep its full width.


Is this still planned?

Definitely would like this feature. Obsidian’s default behavior of wrapping code blocks makes it hard to use for programming-related notes.

1 Like

I’ve started playing with Obsidian and really love it …except for the code-block width restriction so would love to see this implemented.

1 Like

What’s the state of this request? Could this please be reviewed by the Obsidian team?

This should definitely be default for code-blocks. The wrap makes it look really not like it should!

We got an official reply from @WhiteNoise regarding scrollable code blocks, on Discord.

it can’t be easily done

it’s either the way it currently works

or the way table now works (that is you get a drastic change in rendering style once you are editing them)

1 Like

This is also needed with obsidian-krokit, which uses codeblocks to render text-like instructions to graphics. The images produced are too wide when readable line width is chosen with the default theme. Scrollbars are not displayed, so the rest of the rendering is never visible.

The ‘minimal’ theme does more of a usable thing, but it still looks a little wonky. Specifically, the image begins from where the text begins, but then expands beyond to the right. Scrollbars also appear. There appears to be something creating sufficient whitespace / padding on the left side to align with the text, but not on the right.

That said, it would probably be better if the default theme did not try to do any fomatting in the form of word wrapping, resizing, etc of the the contents of codeblocks, and displays them as rendered with scrollbars when needed.

I’m not presently touching any CSS, nor have I tried to look for how I can inspect it. This is just the builtin Light theme and the Minimal theme plugin in Light mode being used with obsidian-krokit, with Readable Line Lengths enabled.

well then we should talk with the theme-maker :smiley:

Blue Topaz is one that has some kind of way: “Non-wrap Codebox (Live Preview)”

You get a horizontal scrollbar, but for each and every line, which is too long!!! So completely useless for now :confused:

I checked some other themes but couldn’t find one that has it :frowning: