SIlly question about Markdown… I’m using Drafts to make bullet and numbered lists. How can I remove the space between the heading and the first bullet? See screenshots… I don’t have a space in the markdown yet one appears in the preview. Any help is much appreciated.
Change the CSS in your HTML preview step to include this:
ul {
padding-left:0;
}
ul li {
list-style-position:inside
}
Markdown generates HTML. Whitespace (like line feeds) are not significant in HTML, only HTML tags which structure the output. So, if you have a Markdown list, like the below:
- Item1
- Item2
You are going to get the HTML output:
<ul>
<li>Item1</li>
<li>Item2</li>
</ul>
How that is displayed in the browser (which the preview step is basically just a web browser displaying the HTML) depends on the CSS styles applied to the HTML tags…which can control things like margins and padding around elements. By default, ul tags generally get about a line of spacing unless the CSS says to do otherwise.
Note that even if you create a preview with adjusted CSS to eliminate that spacing, it doesn’t mean that using that same HTML output elsewhere (like in a Markdown Mail step, or a blog, etc.) will come out the same, because it’s likely other CSS will be is uses in those contexts.
So, if you simply want to force that for your preview purposes, @sylumer’s tip will work - but don’t necessary expect that to work everywhere.
Generally speaking, I will also note that Markdown block level elements, like headers, paragraphs, lists, quotes, should really be separated by a blank line, per the spec. Some Markdown engines will allow what you are doing (as the MultiMarkdown engine used in Drafts) - but some are stricter and would not recognize the list and header and convert them properly - so it might be better to get in the habit of leaving that blank line.
Hope this helps!
1 Like
Thanks all. This is a little more complex than I thought. First time really using markdown coming from other note taking applications like Evernote.