Space between list items without affecting Social Icons
Viewing 1 replies (of 1 total)
Viewing 1 replies (of 1 total)
- You must be logged in to reply to this topic.
Home / Developing with WordPress / Space between list items without affecting Social Icons
(still being a bit of a WP newbie..) I’m trying to add space between list items (li) in unordered lists (ul) and following recommendations I found in previous support posts results in the Social Icon backgrounds becoming “teardrop” shapes with their background colours being extended to match whatever “padding-bottom” I add.
I tried both:
li {
padding-bottom: 16px;
}
and
.entry-content ul li {
padding-bottom: 16px;
}
and both do the same thing to the icons.
The ul class for the Social Icons seems to be::
“wp-block-social-links alignright is-style-default”
and for the unordered list it appears to be:
“wp:list-item”
Is there a way to target only the ul li without affecting the Social Icon background shapes?
Thanks for any help 🙂
Should have mentioned: using Twenty Twenty-Four theme.
I found the solution at:
https://wordpress.com/support/wordpress-editor/adding-additional-css-classes-to-blocks/
I learned to create a custom class for the list block I wanted to target and then wrote the CSS needed. So I created “.my-list-class” for the list and used
.my-list-class li {
padding-bottom: 16px;
}
for the CSS. It works and and I learned yet again something new 🙂