How to reduce the spacing between header and lists?

[Monohponic]

What I’m trying to do

Hey guys, I’m trying to reduce the space between a header and the list following the header. I’ve tried some ways but they didn’t seem to help much. I’m using minimal theme.

Things I have tried

Here are the ways I tried:

• Huge spacing between headers and text
• How to remove margin after/below list heading?

Here’re the photo:

Are there any ways to make the preview mode and reader view mode look the same? Many thanks guys!

[gerbenzaagsma]

I had the same question and created a css snippet with some code:

If you want to change the header (in your example Quick Access) in reader mode this css code works for me (Minimal theme), beware that you need to adjust for header level:

h2, .markdown-rendered h2 {
    margin-bottom: 0px;
}

If there is no header but you’re simply dealing with a list and top text (in your example Dashboards) this css code works for me to adjust reader mode:

.markdown-rendered p {
margin-bottom: 0px;
}

ul.has-list-bullet {
margin-top: 0px;
}

[Monohponic]

Thanks! It worked well! I was wondering if I want to apply the same style to numbered list as well, how should I modify the css code?

[gerbenzaagsma]

You can add this to the code:

ol {
margin-top: 0px;
}