How can I minimize padding in Masonry Theme?

Store Design
1

How do I reduce the space between the images and the titles? It’s such an eyesore and confusing for my customers.

https://lavender-creek-gems.myshopify.com

Screen Shot 2021-08-11 at 2.46.25 PM.png
Screen Shot 2021-08-11 at 2.46.25 PM.png2254×1214 160 KB

2 Likes
2

Hi @bbtrudell

Sorry you are facing issue.

Welcome to the shopify community.

Please add this css at the bottom of your style.css file,

#shopify-section-collection-template .block.product .main {
    padding-top: 100%;
}

If its works like and accept solution.

Thanks

1 Like
3

hello @bbtrudell

please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

#shopify-section-1481722768807 .blocklayout .block  .main{
        padding-top: 65% !important;
    }
    #shopify-section-1481722768807 .block  {
        height: 390px !important;
    }
1 Like
4

@bbtrudell

sorry for that issue can you please try this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/styles.css ->paste below code at the bottom of the file.
    this code apply for after 5 - 6 second
.block.product .main {
    padding-top: 70%;
}
2 Likes
5

Please follow the steps:

  • Step 1: Go to Online store > Themes > Actions > Edit code.
  • Step 2: Go to Assets > styles.css and paste this at the bottom of the file:
    .block.product .main {
    padding-top: 65% !important;
    }
1 Like
6

This worked perfectly, thank you!

1 Like
7

@bbtrudell

it’s my pleasure to help us

1 Like