How to increase space between bullet points

[Sarah Cairncross]

Hi Tom, I’ve had a search through the forum and gone through the upgrade plugins but can’t see anything that will help me increase the space between bulleted and numbered items in my blog post (http://tinywebservices.com/how-to-set-up-facebook-live-for-pages/)

I find them realllllly hard to read like that and if I insert a <br> it gets stripped.

Is there some CSS code I can apply or am I missing a setting in Customizer somewhere?

Thanks for your help,
Sarah

[Tom]

Hi Sarah,

Try this CSS:

.entry-content ul li,
.entry-content ol li {
    margin-bottom: 10px;
}

Let me know 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Sarah Cairncross]

Tom you are star! Thank you SO much – that has sorted it out perfectly 😀

[Tom]

You’re very welcome 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development

[Enrico]

Hi Tom, this css is not working in pages that use sections add on.

How I have to use it with page made with sections?

If I use it without entry-content it works but it add a margine also on the menus. So I can not use it this way.

[Leo]

Can you link me to the page? Feel free to start a new topic so you have a private URL field to submit with.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Enrico]

Hi Leo,

1) this code:

.entry-content ul li,
.entry-content ol li {
    margin-bottom: 10px;
}

should work with sections?

2) or this code:

ul li {
    margin-bottom: 10px;
}

should not add margin to menus?

I have now set the code 2) in this site: digitaldem.it.
Now it has WordPress 4.9 beta 4 but it was all the same with the official WordPress version 4.8.2

[Leo]

Menu is a list so yes 2) will apply to menu as well.

I’m not sure what you are trying to accomplish and the page you link isn’t using sections?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Enrico]

You are right, sorry, I linked the wrong site. The correct one is questsocial.it

I need to have lists with more space between lines.

In other sites, that don’t have sections, I use this:

.entry-content ul li,
.entry-content ol li {
    margin-bottom: 10px;
}

Now I have put this code in the site with sections but don’t work there.

[Leo]

Try:

.generate-sections-container ul li,
.generate-sections-container ol li {
    margin-bottom: 10px;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Enrico]

Thanks a lot Leo! This is the right CSS code for pages with sections.

[Leo]

No problem!

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts