Reduce white spacing around products - Showcase Theme

[BK01]

 

Hi I am having trouble with the featured collections on my home page, the Collection list on my home page and also the Collection pages. I want to reduce the white space around all to 4px, I was able to do it to only the columns on the home page "Featured Collection" by using: 

.half-gutter .column {
padding-left: 4px !important;
padding-right: 4px !important;
}

I cant seem to figure it out for the rows spacing or the outside margins for any others. Please any help would be greatly appreciated ! 

[devcoders]

Hello @BK01 

Thank you for submitting your query to the Shopify community. I’d be happy to assist you. Could you please provide the store URL and password (if it’s password-protected) so I can review and get back to you with an update?

[BK01]

Hi thank you - salt-sista.myshopify.com gockau

[devcoders · Accepted solution]

Hello @BK01 

Go to Online Store, then Theme, and select Edit Code.
Search for assets/styles.css Add the provided code at the end of the file.

@media screen and (max-width: 749px) {
.wide-container .product-block {
margin-top: 0 !important;
}
}

[BK01]

Thank you so much! 

That worked!!

I am just having one small issue with the collections page now in regards to the left margin or padding, this is not happening on the featured section nor the collection section of the home page, just the collections page. 

The margin is cutting off the writing on the left, again I am using that code to reduce the size between the columns however it is affecting the left side too much. 

.half-gutter .column {
padding-left: 4px !important;
padding-right: 4px !important;
}

 

[devcoders]

Hello @BK01 

You're very welcome! I'm thrilled to hear that you're pleased with the outcome. Don't hesitate to reach out if you need further assistance.

like and accepting the All solution. Thank you!

[BK01]

No worries, I have accepted at the solution, I did write in my reply, there was one other thing are you able to assist ? 

I am just having one small issue with the collections page now in regards to the left margin or padding, this is not happening on the featured section nor the collection section of the home page, just the collections page. 

The margin is cutting off the writing on the left, again I am using that code to reduce the size between the columns however it is affecting the left side too much. 

.half-gutter .column {
padding-left: 4px !important;
padding-right: 4px !important;
}

[LizHoang]

Hi BK01

You can try to follow this step
Step 1: Go to Edit code
Step 2: Find file styles.css and add this code at the end of the file

.product-block.cc-product-block.hover-image.product-block--marquee-on-hover.product-block--quickbuy.column.third.cc-fade-in-up.cc-animate-init.cc-initialized.-in.cc-animate-complete {
    margin-top: 0 !important;
    padding: 0 !important;
}

Result: 

Best,

Liz