There’s a solution that doesn’t require digging into classes. Obsidian and CodeMirror use CSS variables. I’ve successfully used the following CSS snippet:
:root {
--line-width: 50rem;
}
@arathunku: Doesn’t work for me. The variable is actually:
body {
--file-line-width: 750px;
}
6 Likes
This is great to hear! My solution worked with the most recent version at the time. I assume --file-line-width is now for 1.0.0?
I’ve just spent a silly amount of time bouncing between different threads trying to work out what I’m doing wrong, and trying numerous bits of code along the way only to find that I should have read the rest of the thread to find the code that does work (and then, for some reason, doesn’t work for me still).
I am starting to think I must have a plugin overriding the functionality.
I am using the Full Screen Mode Plugin to make the currently selected document exclusively full screen. I have tried with Minimal and Default themes. Maybe Style Settings or Minimal Theme Settings? Neither have exposed this variable for adjusting as far as I can see though, but I’m still new.
Ideally, when using non full screen mode, I want to either turn off readable line length or adjust it to fit a percentage of most of the size of the window.
When using full screen mode (wide screen monitor), I want to limit the width of the text and hide the scroll bar (only in this single document mode, ideally).
The simplest way to achieve this is to set the width of the text to what I want in full screen mode, and just be happy with that being the same maximum size when working in regular mode - and that probably would be fine, too.
I am able to enable, load and refresh CSS snippets in the .obsidian\snippets folder, but none of the snippets I find on here seem to function for this.
Has anyone got this reliably working now, and if so, pretty please let me know how?
Edit: Once again I’m a noob. Somehow I turned off Readable Line Length and didn’t check it while testing CSS for the past hour. Yeesh! But for some reason, none of the code is still working. I am trying to figure out what other nooby things I am still doing wrong.
Edit 2: The only code that seems to work for me now is:
body {
–file-line-width: 750px;
}
But the Minimal Theme or Minimal Theme Settings override this somehow.
1 Like
Can also confirm I am triple the goose after not being able to figure this out for the past hour:
If you make sure to enable Readable Line Length and don’t somehow turn it off by accident, Minimal Theme Settings has several ‘Line Width’ settings that do all this work for me.
Love this place, not so much a fan of how I stumble over my own feet, but hey XD
The only thing that worked for me:
body {
--line-width-adaptive: 60rem;
}
I was looking into a way to do this for my own personal notes. I prefer to keep Readable line length enabled for the majority of my notes. So I wanted to be able to toggle this with a simple class.
This was the solution that I used which worked for both the preview and editor modes.
/*
- CSS to expand single notes into larger pages.
- Corrected the Editor and Reading View
- Useful if you prefer to keep the Editor > Readable line length option enabled
Usage:
- Can be called with YAML Class in the header of the note:
---
cssclass: LargePage
---
*/
.LargePage {
max-width: 1500px;
margin: auto;
--file-line-width: 65rem;
}
4 Likes
If anyone is still looking for a solution: The Style Setting plugin can do this easily without having to mess with Css
It seems that the Style Settings plugin only offers this option if one is using the Shimmering Focus theme.
It would be nice if this setting were not theme specific.
Obsidian my do this already, but popular plugins and repeated questions, I hope they consider incorporating this into a new version. It seems like there should be an adjustable style for everyone. IMHO of course. I have the same philosophy with all programs with plugins/extensions/add-ons. I’ll try the plugin for now, 
Thanks! @hapham
I’m just hacking this to get going, but @varian93 that’s not correct, but it did populate when I added a theme. So you may just have to grab one other than the default, but I may have to add edit the css per instructions to get the appropriate slider, if I’m understanding correctly
You don’t “need” a theme, that’s just the easiest way for the setting to appear. It needs some CSS.
“For example, adding this to a CSS snippet in your vault:”
My theme, didn’t come with a line-width setting, so I added the example from [here] under the existing settings (GitHub - mgmeyers/obsidian-style-settings: A dynamic user interface for adjusting theme, plugin, and snippet CSS variables within Obsidian)
id: line-width
title: Line width
description: The maximum line width in rem units
type: variable-number-slider
default: 42
min: 10
max: 100
step: 1
I had some trouble, so I copied the segment from the Shimmering Focus css into my Tokyo css. Shimmering focus has tons of style settings, so it’s a great example for those of us that aren’t css experts!
- id: file-line-width
title: Line Length
description: "The length of the editor content (when the `Readable Line Length` Setting is enabled). You can use the cssclass `full-width` to lift line length restrictions for individual notes."
markdown: true
type: variable-number-slider
default: 700
min: 300
max: 2500
step: 25
format: px
I don’t know the order of operations here, but I think the most useful thing would be to have some of these out of themes and directly under the vault, as the example suggest. It would be awesome if that “default” overrode the themes, if not, would need to remove all duplicate settings in themes.
Hi, I have tried all possible css solutions provided, but for me loading the css in appearances and toggling it on changes no effect. I would propose to have a specific readable line length width scale in appearance settings.
Use case or problem
Text wrappinng is one issue, but for scientific documents wrapping long equations is much more convoluted.
Proposed solution
Readable line length width toggle in apperances.
Current workaround (optional)
CSS files which I tried to apply to the newest version v1.5.3, but make no effect.
Related feature requests (optional)
The simplest snippet would be:
body {
--file-line-width: 65rem;
}
and works with most themes. Minimal needs a slightly different version or can be adjusted using Minimal Theme Settings > Typography → Normal line width.
