Add line breaks to nested lists in Markdown

23.8k views Asked by At

I am new to Markdown and stuck. As of now, I am learning to be honest with Markdown itself using the Jekryllrb platform - I use the same for my blog via Octopress; however, I am finding it difficult to add a line break after a nested sublist (unordered) to it's superlist (ordered). Here is the sample:

1. [Lucideus Tech](http://www.lucideus.com) - 2011 - 2012 (1 Year)
    - Security Analyst
    - R&D @Lucideus Labs
    - Web Application Penetration Tester  
2. [CTG Security Solutions](http://www.ctgsecuritysolutions.com) - 2012 (8 Months)
    - Trainer Scheduler
    - Web Application Security Trainer  
3. Defencely Cloud Security Pvt. Ltd. - 2013 to Present (2015)
    - Red Team Lead
    - Web Application Security Specialist
    - Technical Specialist and SPOC @Application Security  

How do I add a line break after each of the ending sublists to keep them all neat, since if not, it all looks out of context and ridicules the styling?

1

There are 1 answers

3
Chris On

Adding <br> tags in Markdown is somewhat unintuitive because of the way it handles paragraphs. From Paragraphs and Line Breaks on the syntax page:

When you do want to insert a <br /> break tag using Markdown, you end a line with two or more spaces, then type return.

This answers your second question.

The first is a bit trickier, and it relates back to Markdown's design goals, as explained in the Inline HTML section of that same document:

Markdown’s syntax is intended for one purpose: to be used as a format for writing for the web.

Markdown is not a replacement for HTML, or even close to it … The idea for Markdown is to make it easy to read, write, and edit prose. HTML is a publishing format; Markdown is a writing format.

Adding space between those list items is a styling question, not a semantic one. Markdown doesn't say anything about styling; it is entirely focused on writing, and therefore on semantics.

I believe that the best way to add your vertical space is to do it by applying CSS on the HTML output from Markdown, for example by styling <ul> tags contained in <li> tags, e.g.

li > ul {
  padding-bottom: 0.5em;
}