Home>Support>Custom CSS for the margin around bullets and numbering in editor

Custom CSS for the margin around bullets and numbering in editor

Hello!

Just want to say that your product is incredible, thanks so much for what you guys are doing. The support on this forum is awesome as well, I have found so many answers through these forum posts, so thanks for the support as well.

I can’t find an answer for this question though. I am trying to reduce the left and bottom margin for a specific set of numbering/bullet points on my page. I don’t want to change the CSS style for all bullet points & numbering across the site – just for this specific set of bullets & numbers.

How do I do this?

In the specific SiteOrigin widget, under Attributes > CSS Styles, I’ve tried pasting the following, which I found and then adapted from some of the other support threads:

.entry-content ul li, .entry-content ol li {
margin-left: 1em;
margin-bottom: 1em;
}

Unfortunately, it’s not having any effect on the page.

Could you please help me?!

Thanks again for your great work
Matt

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 7 years, 2 months ago Alex S
    Hi, I Work Here

    Hi Matt,

    Thank you for the kind words! :)

    In the specific SiteOrigin widget, under Attributes > CSS Styles, I’ve tried pasting the following, which I found and then adapted from some of the other support threads:

    The CSS Styles field you’re referring too only supports inline styling. This means anything with a selector won’t work. In other words, this will work:

    color: #0f0;
    border-bottom: 20px solid #000;
    

    This won’t work:

    .example {
        color: #0f0;
        border-bottom: 20px solid #000;
    }
    

    Ignoring this issue, that CSS would affect all lists, not just this one specific widget.

    Please open the widget you wish to alter the the margin for and head over to the widget styles sidebar. Open the Attribute settings group and set the widget class to list-alter_margin and then save. Please navigate to WP AdminAppearanceCustom CSS and add (and adjust) the following CSS:

    .entry-content .list-alter_margin ul li, .entry-content .list-alter_margin ol li {
    	margin-left: 1em;
    	margin-bottom: 1em;
    }
    

    You might also need to install the SiteOrigin CSS Editor.

    If that didn’t work, do you have a public URL where we can take a look at your setup to try and work out why it didn’t work?

    By the way, as you’re a premium user, you’re entitled to priority email support. If you would like to make use of that, please follow the instructions found on your Page: Dashboard (please refer to the support tab). Please reference this thread and include your SiteOrigin order key in the email.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More