How to add multi line breaks in preview mode

[0xbf]

I am familiar with markdown. When I add multiple empty lines in the markdown file, I expect it will also show those lines in the preview mode, but seems no matter how many lines I added in markdown, those lines are always be eaten up in the preview mode. (shown below)

I am wondering is it possible to keep those lines in Obsidian, or is there some settings I am missing? Thank you!

My markdown file:

and the preview, you can see the spaces above section 2 have been eaten up.

[rigmarole]

Every Markdown implementation I’ve tried removes white space in this same way. Double spaces or trailing spaces should get turned into single spaces as well.

You can add more line breaks by using <br> html tags. I don’t know if you can use style to make them taller or not. I saw a release note about how style tags are not supported. But <br><br><br> would add multi-lines.

[0xbf]

got it, thank you. I was using typora which support multiple lines, so just wondering if could do the same thing in obsidian.
maybe obsidian could add an option in settings to support this, like the “strict line breaks” one?

[ryanjamurphy]

@0xbf

maybe obsidian could add an option in settings to support this, like the “strict line breaks” one?

Feel free to suggest this via #feature-requests!

[mumumu]

[truth]

@0xbf Just in case you are still looking for a solution, here is the best approach I have. First though - I too would emphasize the desire for adding whitespace with just carriage returns. I have a default metadata section that is added at the end of every note, and I greatly prefer to have this stuff pushed down away from the main text of the note.

Also, there are many ways to add whitespace that look fine in the preview mode, but look rather messy in the edit (markdown) mode. Adding a bunch of <br>'s for instance is not my definition of pretty white space when you look at the markdown version.

So I solved it by using a bunch of \ characters, one per line, in multiple lines. Then, with the very last one I add a single tab key. This is at least somewhat clean looking inside both the straight text version and the preview version.

Here is the markdown example:

Last Text
\
\
\
\
\
<tab>
New Text

which translates to

Last Text





New Text

What this is doing is using the “line break” feature of Obsidian’s MD parser to add in line breaks. Eventually, it needs to force a full paragraph break by seeing a normal character (a space won’t work). For a while I used a \. on the final line (which displays a single dot). Then I realized that a tab character in Obsidian will be translated as a valid empty character.

This is the closest I’ve gotten to something that looks good in both markdown and preview modes.

[OlivierPS]

As one says :

It’s not a bug, it’s a feature.

Multiple empty lines are a no no in good typography. We speak rather about vertical space and this is added via styling the different sorts of paragraphs, header, and so on.

That beeing said, when I want to add white vertical space, I just put “em spaces” on lines by themselves and it works perfectly. In edit mode, you have two possibilities :

• invisible space : (you don’t see it, but it’s there, I guarantee you)
• visible space :  

I have Typinator macros (you can do the same with tools like TextExpander) :

EMSP → types the invisible EM SPACE
emsp → types the visible (HTML entity)  

In the end, for example, it’s easy to type

Last text

 

&emsp;

 

new text

It works beautifully.

Another idea : you could also program a Keyboard Maestro macro that types

Carriage return
 
Carriage return

And affect it to, say, Opt-return

My two cents.

Olivier :-{)

[rigmarole]

Nice, this is the best answer for me personally! The biggest time I want to add extra whitespace is inside quoteblocks, when I want a paragraph break without breaking the quoteblock border and without muddying the quote with syntax. An invisible emspace works perfectly!

[mrkuramoto]

I was able to add spaces between blocks playing with CSS but it worked only with the “edit mode”. I have been trying for a long time but never had success with “preview mode” and this is one of the reasons that I remain with Roam Research - for me it is easier to read on the screen. If someone knows how to do that using CSS, please let me know.

[mrkuramoto]

I don’t know how it works, but works. I have just paste the code below in Obuntu.CSS theme and now I have white space between blocks in “preview mode” without type anything on the markdowns.

ul>li,
ol>li {
padding: 10px 10px;
min-height: calc(1.5em + 6px);
margin-top: 2px;
margin-bottom: 1px;
}

in order to have white spaces in edit mode, I pasted this code:

.cm-s-obsidian pre.HyperMD-list-line {
padding-top: 1.3em; (acho que 0.3 é o standard e 1.3 é a próxima opção)
min-height: 2.5em;
}

[Suraj]

I honestly loved this solution.

Those of us who would prefer less cluter in both views would find this workaround to be easy on the eye.

Thank you so much for sharing this.