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 🙂
- You must be logged in to reply to this topic.