I’d like to get the effect desired in this question - when there is a Markdown paragraph followed by a list item (separated by a single newline), I’d like to have the rendered list also not have a space between it and the preceding paragraph. I primarily use Obsidian which renders lists in this way in Live Preview, but currently Hugo separates them whether or not there is a space between the list and paragraph.
Is this possible? I’d like to do this without altering the source Markdown.
No, it does not. Hugo’s markdown renderer follows the CommonMark spec (try it). You are seeing the effects of either default browser CSS, or custom CSS in your theme.
With no CSS, this markdown:
This is a list:
- one
- two
is rendered to:
<p>This is a list:</p>
<ul>
<li>one</li>
<li>two</li>
</ul>
And looks like this in the browser:
You can add some CSS:
p:has(+ ul) {
margin-bottom: 0;
}
p + ul {
margin-top: 0;
}
Thank you for clarifying and for the CSS snippet, @jmooring, it’s working on my site. I think it removes the space whether or not a space is present between the text and and the list in Markdown, but that’s fine with me.
Whether or not there’s a space between the text and the list items below is irrelevant. Both are rendered to the same HTML per the CommonMark specification.
Example 1
This is a list:
- one
- two
Example 2
This is a list:
- one
- two
Both are rendered to:
<p>This is a list:</p>
<ul>
<li>one</li>
<li>two</li>
</ul>