Trying to get rid of space between header and bullet list

Anki Card Design
1

I am trying to get rid of the automatic space that inserts itself between a header and the bullet point list below the header when creating the back of my cards. Is there anything I can type into the cards styling box to prevent this space from automatically occurring every time I insert a bullet point list?

For example, my desired list would look like this:

Header
-List item
-List item

Instead of:

Header

  • List item
  • List item

I’ve tried adding several CSS text lines to the card styling box, but to no avail. These have included:

ul li, ol li {
margin-top: 0ptx;
margin-bottom: 0ptx;
}

p { margin: 0; .card ul ul li:last-child, ol ul li:last-child { margin-bottom: 10px; } Etc... Any help with this is appreciated.
2

Sure. Let’s say you’ve got the following html in your card:

<h1>Header</h1><ul><li>List item</li><li>List item</li></ul>

You then can use the following css:

h1 {
	margin-bottom: 0;
}

ul {
	margin-block-start: 0;
	padding-inline-start: 0;
}

You should download the Anki webview inspector, it’s very helpful for card design.

1 Like