Sign inGet GeneratePress One

Archived topic

Change CSS to remove margins on list block

3 replies · Started by Ben on April 28, 2021

Viewing posts 1–4 of 4
#1754622

Hey guys,

I've added some custom CSS to remove the margin on the list block in the Gutenberg editor.

As it is, it's removed the margin sitewide but I want to target specific blocks.

So how would I do this?

Thanks

#1754946

Hi there,

select the List Block you want to apply the style to and in the sidebar Advanced > Additional CSS Class(es) give it a custom class eg. reduced-margin

This class gets appended to the <UL> or <OL> element so our CSS would then be:

/* Unordered list */
ul.reduced-margin {
    margin-left: 0;
}
/* Ordered list */
ol.reduced-margin {
    margin-left: 0;
}

Or you can combine both list types into one style:

ul.reduced-margin,
ol.reduced-margin {
    margin-left: 0;
}
#1755005

That's perfect, thanks!

#1755031

You're welcome

This archived topic is closed to new replies.