How to change the spacing between two 'icon with text's on product page?

[tjieko]

I have been having a bit of an issue with two icon with text’s on my product page.

If you go on the product page example below and look right underneath the price, you see a four sentences with a green check mark underneath ("Shipping time, shipping price, includes app, and street-legal). Those sentences use an ‘icon with text’ section, but I selected ‘none’ as the icon, so there is no icon. The spacing between the first three and last one is not the same. I would like them to have the same spacing (5px) so it looks like a proper row, and not two different sections.

My URL: https://vouwfatbike.nl

Example: https://vouwfatbike.nl/en/products/windgoo-e20

Thanks already!

[BSSCommerce-HDL]

Hi @tjieko ,

Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above tag:

Here is result:

Hope this can help you,

If our suggestions are useful, please let us know by giving it a like or marking it as a solution. Thank you

[BSSCommerce-B2B]

@tjieko ,

Step 1. Go to Admin → Online store → Theme > Edit code

Step 2. Find the file theme.liquid.

Step 3. Add this code above

Result

[Made4uo-Ribe]

Hi @tjieko

check thiso ne.

From you Admin page, go to Online Store > Themes

Select the theme you want to edit

Under the Asset folder, open the main.css(base.css, style.css or theme.css)

Then place the code below at the very bottom of the file.

ul.icon-with-text.icon-with-text--vertical.list-unstyled.icon-with-text--text-only {
    margin-bottom: 5px;
}
ul.icon-with-text.icon-with-text--vertical.list-unstyled.icon-with-text--text-only {
    margin-top: 5px;
}

And Save.

Result:

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!