How do I ensure that whitespace is preserved in Markdown?

Question

Currently, I have this line in a Markdown file detailing command output:

1\. Work (00:10:00)  
    1\. Mail letter (00:05:00, Est. 00:03:00)  
      Send letter to Foo Bar  
2\. Personal (00:02:00)

However, when I preview the Markdown file, all of the whitespace is disregarded.

1. Work (00:10:00)
1. Mail letter (00:05:00, Est. 00:03:00)
Send letter to Foo Bar
2. Personal (00:02:00)

How do I preserve this whitespace?

Cauvery

Just as an aside for other people who stumble upon this that I found helpful from this SO post: If your markdown compiler supports HTML (most does) then you can use <br> to create line breaks. I know this isn't the type of white space the OP discusses, but people might find this helpful. – Pollination

@TokeFaurby As well as using <br> on those Markdown renderers that support HTML, you can also just put two spaces at the end of a line to force a line break. This should work even on Markdown renderers that don't support HTML, and is also less intrusive for people reading the text file. (And, after all, readable text files even when they're not rendered is really the whole point of Markdown.) – Withdrawal

Answer 1

Markdown is used primarily to generate HTML, and HTML collapses white spaces by default. Use   instead of space characters.

Persevering

This works for Jupyter notebooks (though I had to add lots of them to get the spacing I wanted). – Acrosstheboard

In github markdown inline code blocks (possibly other places) you can use <code>&nbsp;</code> to preserve spaces, instead of using backticks. – Gannon

The <code> method works also in Jupyter Notebook. – Jalapa

Or just insert a Unicode NO-BREAK SPACE character itself. Vim provides this as digraph NS, so you can type Ctrl-K followed by that to enter it. (Apparently some systems also insert a no-break space when you type Alt+Space.) I use this extensively because, unlike  , it also works with my paragraph reformatting tool. – Withdrawal

Answer 2

Use non-breaking spaces

To preserve spaces in a markdown document use a non-breaking space:
"a space character that prevents consecutive whitespace characters from collapsing into a single space, and also prevents an automatic line break at its position".

Example

See an online and editable example here.

This line uses            non-breaking            spaces in many places;       they are not collapsed.
                                   There is no need to use code blocks.

This line uses many consecutive spaces in many places; they are all collapsed.

Note:
Copy and paste the previous example could not work because sometimes the non-breaking spaces are changed to normal spaces in a copy-paste operation :‑(.

Or try a table

However, if you intend to use non-breaking spaces to align text, prefer to use tables.

Example code:

| Country  | Capital |
| -------- | --------|
| Portugal | Lisbon  |
| Spain    | Madrid  |
| Cuba     | Havana  | 

But not all Markdown implementations recognize the previous syntax.

How to introduce a non-breaking space?

• In macOS, you need to press ⌥ Opt+Space
• In Windows, sometimes work Alt+0+1+6+0 or Alt+2+5+5
• In many commercial software Ctrl+Space
• In Linux, Compose key enabled Compose Space Space

The beauty of this solution is that you don't need to use any code in your Markdown document. For example, in HTML you must use  .

PS:
Reader, please, let us know in the comments is this method does not work in your particular markdown editor. I have tested this method in two apps and several online editors.

Xyster

In Clion on Ubuntu, I enter the non-breaking space with alt gr + Space – Stinkweed

@FredSchoen hi, what is alt gr key? – Burkey

I'm using vnc for connecting my ubuntu machine. How do I enter compose space space? I don't such a key.. – Burkey

@ChanKim It's this key I have on my German keyboard, en.wikipedia.org/wiki/AltGr_key If you use a US keyboard, you may not have it – Stinkweed

@FredSchoen I see, I tried 'space + alt(in the right side of space bare in my Korean keyboard)' but didn't work. Thanks anyway!(Eric Chow's answer worked for me). – Burkey

It does not work for me. Also, none of the examples in the editable example work on my jupyter notebook. – Bookstand

@ah25 It's apparently a bug in Jupyter. See this: github.com/jupyter/notebook/issues/3105. – Xyster

This is a working solution that avoids HTML, but unless your editor help you identify such characters specifically, it makes the content difficult to maintain. I personnaly add HTML as a consequence. – Legumin

Preserving the text output (when using markdown and copy-pasting) is a must for me. Hence, I'll go with  . (Even though it costs med 6 characters instead of just one. I need it only very seldomly.) – Downpour

Answer 3

One alternative is to use

<pre></pre>

like:

<pre>

    1 
   / \ 
  2   2 
 / \ / \ 
3  4 4  3 
</pre>

the pyramid will be preserved.

Of cause, you can use   . I use them both, depending on needs.

Oca

Nice! For others who are wondering what <pre> is for, it's an HTML tag for pre-formatted text. "Text in a <pre> element is displayed in a fixed-width font, and the text preserves both spaces and line breaks. The text will be displayed exactly as written in the HTML source code." – Paryavi

This is the preferred way, as it uses regular spaces, and not non-breaking spaces. If for exemple you are citing a code exerpt, use the pre tags. nbsp are not considered as separators in the shell and would mess things up and make the code invalid – Hereditary

Answer 4

I find   very cumbersome to use, ie. if you have large document, it may become ugly for edit, and you would need lot's of copy pasting of  , and in the end you will also need to adjust indentation.

instead use 3 accents (```) to denote code (well, you only care about indentation and whitespace here).

for example this is how text looks without any formatting:

Enabled = "True"

Profile = ("Domain", "Private")

Direction = "OutBound"

RemotePort = ("8080", "8081")

LocalPort = ("9080", "9081")

And this is how it looks with   doing quick copy paste

Enabled      = "True"

Profile      = ("Domain", "Private")

Direction      = "OutBound"

RemotePort      = ("8080", "8081")

LocalPort      = ("9080", "9081")

And here is my sulution, very simple, quick and effective:

Enabled               = "True"
Profile               = ("Domain", "Private")
Direction             = "OutBound"
RemotePort            = ("8080", "8081")
LocalPort             = ("9080", "9081")

EDIT:

This last example is surrounded by 3 accents at the beginning and at the end, ex:

(```)
your text here
(```)

Leprosy

Answer 5

For the purpose of building ordered lists and sub-lists, you only need to space any sub-list with 3 white-spaces, and remove the \ symbols from your example, like this:

1. Work (00:10:00)  
   1. Mail letter (00:05:00, Est. 00:03:00)  
      Send letter to Foo Bar  
2. Personal (00:02:00)

To get this:

1. Work (00:10:00)
   1. Mail letter (00:05:00, Est. 00:03:00)
      Send letter to Foo Bar
2. Personal (00:02:00)

Speller

Answer 6

A possibility that I've used in contexts other than markdown, but that appear to work for markdown too is to use one of the other Unicode whitespace characters.
Unicode.org general punctuation PDF
A site from which you can copy/paste the characters.

For example, I've tried the Em Space (U+2003) and it displays as a single space in vim, in VSCode, and on GitLab (private company page I have).

It's not without a couple of possible downsides though.

1. Since it appears as a normal space in editors, someone else may be quite confused as to why their spaces don't work, but others(yours) on the page do. Maybe put a comment in your document to alert others.
2. It may not be future proof, if HTML rendering engines start treating even those Unicode general punctuation spaces as they do ASCII space and tab, then you're back to needing other methods.

caveat emptor

Marlyn

Answer 7

In vscode, add the extension "Trailing Spaces." Then to exclude by syntax, go to Preferences > Settings and check Markdown>Preview:Breaks or in settings.json, add "markdown.preview.breaks": true

Ferri

Answer 8

1. Create a new file Markdown.sublime-settings in the Packages > User (in mac OSX, Preferences → Browse Packages...) if it already does not exit.

2. Add the following content in the Markdown.sublime-settings

    {  
        "trim_trailing_white_space_on_save": false  
    }

Note: you can do this same trick with any other language specific settings you'd like to create).

Tomtit

That's good but the OP never mention he or she is using sublime. – Intensifier