Correct way to reduce line spacing & line width?

Hi there,

Along with enabling “Readable line length”, I’m using the following CSS snippet to reduce line spacing & line width:

.cm-contentContainer {
line-height: 1.2;
}
body {
–file-line-width: 58rem;
}

This snippet works fine, however it changes the behavior of the ‘End’ Key: now when I press ‘End’, the cursor does not go to the end of the current line as it usually does, but instead goes to the beginning of the next line. I am using this key all the time when writing and eager to find a way to fix it.

If I disable the CSS snippet, things work normally again. The problem occurs regardless of which Obsidian theme I use. I’m on PC, Windows 10, using Obsidian 1.0.3. Would anyone know how to fix this, or perhaps know of another way to control line spacing & line width without causing the cursor issue? Many thanks.

i don’t think the css is the issue. seems pretty basic. also i tried on my vault, cannot reproduce that. possibly a combination of that css snippet and a plugin?

why don’t u try disable all plugin (or simply turn on “Restricted Mode”) but keep the css snippets. if indeed that solves the issue, then u can try enabling plugin one at a time to find out what combination does that

1 Like

Thanks - I tried turning on “Restricted Mode” and keep the CSS snippet on, the problem is still there. I tried also disabling community themes and use the default theme, same problem. Tried typing a new note from scratch or using an already typed note, same issue with the End Key.

Hey Turbo :racehorse:

What is your ultimate goal?

To make the text-area narrower?

In that case, why not just add padding to cm-scroller (which displays the editor text).

Like this:

.markdown-source-view.mod-cm6 .cm-scroller {
	padding-left: 75px;
	padding-right: 75px;
}

(and get rid of that other “file-line-width;” CSS)

Does that achieve what you are looking for?

Hey Turbo, I updated my last post with a question about your ultimate goal, and an alternative method.

[eliminating the “–file-line-width” line (since that seems to be causing your ‘end-key’ problem) and using cm-scroller padding instead.]

Just adding this to make sure you see the edit.

Hey ZenMoto,

Thanks so much for your help. I’ve been working in Scrivener for years and I’m looking to reproduce the line spacing and page width I had over there. So the goal is:

  • The reduce the height of the space between the lines to 1.2
  • To make the line width narrower so that there’s some blank space on either side of the text area

I tried your cm-scroller solution, but it didn’t solve the issue. However it made me realize the problem comes from the line-spacing CSS:

.cm-contentContainer {
line-height: 1.2;
}

This is what causes the End key issue. When I remove the above CSS, the problem goes away regardless of which CSS I use for page width (cm-scroller or file-line-width). So I feel like we’re nearly there :wink: Now I’m wondering, is there a way to reduce the line spacing without causing the End key issue again? Many thanks!

How about this?

.cm-line {
    line-height: 1.2em;
}

cm-line refers to every line in the editor.

Thanks. No, same issue.

If you cut ALL other CSS, and leave only:

.cm-line { line-height: 120%; }

then does your end-key work properly?

(I’m asking because, that cm-line shouldn’t change your end key functionality.)

Just tried it, same problem.

Does this behavior occur in all files? Or in a few files?

Have anybody else experienced this behavior?

I don’t doubt you experiencing this, but it doesn’t make sense that the CSS should change the behavior of one particular key.

If you create a new vault, with no plugins just the CSS, does that behave the same?

Thanks Holroy. I know it’s really odd. The problem is the same on all files. Whenever I disable the CSS, the End key functions normally again. I tried creating a new vault, no plugins, only the CSS, typed a new note from scratch, same issue.

Well, for an alternative fix… if you are on a Mac:

  • “CMD →” jumps to end of line
  • “CMD ←” jumps to start of line

Not sure about the shortcut for Windows… possibly:

  • “Ctrl E” - jump to end of line
  • “Ctrl A” - jump to start of line

i think now u have to explore possibility that it’s your system (meaning Windows + other background app).

  • if u have the luxury, try it with another PC but with the same vault. if another PC solves it, like sth non-obsidian is triggering it.
  • alternatively, create a new vault (or even sandbox) and just add just that one snippet (don’t add other snippets). If it solves it, then try adding other snippets and then adding other plugins u have.

also it would be great if you can do screen record or sth.

1 Like

Could you please provide a pure copy- paste of the entire CSS-file which is causing the error?

Thanks guys. I already tested the issue in a new vault with no plugins and no other css, without success. I’m gonna test on a virtual machine and report.

This is the exact css snippet causing the error:

.cm-contentContainer {
line-height: 1.2;
}
body {
–file-line-width: 58rem;
}

Same error with this snippet:

.cm-line {
line-height: 1.2em;
}
body {
–file-line-width: 58rem;
}

However, this snippet produces no error:

body {
–file-line-width: 58rem;
}

I tested it on a virtual machine, on a fresh install on Obsidian but using the same vault as the one on my local machine, the line-height CSS causes the same problem. I also tested on a new vault. Same problem.