Adding margin before and after a list

Devs: Theme Design & Custom CSS
,
1

First, search the help docs and this forum. Maybe your question has been answered! The debugging steps can help, too. Still stuck? Delete this line and proceed.

What I’m trying to do

I’m trying to find a way how to add top and bottom margins to a block of an unordered list, but all classes I’m trying in Obsidian add a gap between paragraphs, not above the first line and below the last line of list. Any idea how can I achieve that?

Things I have tried

I’ve tried so many classes to adjust it, I could fill a page. I even asked AI and it couldn’t find any solution. I also tried some tactics like adding -first-of-type markers to css classes, also with no luck.

Is it even possible to adjust margins in an unordered lists in Live Preview without affecting the paragraphs at the same time?

2

Try this:

:root { --list-gap: 2em; }

:not(.HyperMD-list-line) + .HyperMD-list-line {
  padding-top: var(--list-gap) !important;
}

.HyperMD-list-line + :not(.HyperMD-list-line) {
  padding-top: var(--list-gap) !important;
}
3

It works! Do you know how can I do similiar thing, but for other elements, adding gaps after simple paragraphs, between blocks (callouts) in both Reading View and Live Preview?