Increasing space between heading and product image - in 'related products'

Site URL: https://eventkit-test-site.squarespace.com/shop/the-essentials-kit

Hi All

I'm after a Custom CSS fix to increase the space between the heading and the product image in the auto section of 'related products'. See image for reference.

Hopefully there is an easy fix?!

Thanks,
Rachella

Add to Design > Custom CSS

/* space under related title */
.ProductItem .ProductItem-related-label {
    margin-bottom: 40px;
}

Brilliant, thanks. It's fixed!

On 7/20/2021 at 3:36 PM, tuanphan said:

Do you need fix this?

(Desktop – Training) Input box is not aligned.

https://eventkit-test-site.squarespace.com/courses

Thanks but no need to fix - I’ll be deleting that section. I have just been working on the shop page until now and will update the rest soon.

I do have one question I’m sure you can help me with though!

It’s about reducing the spacing around logo in the footer (when shown on mobile). I’ve added CSS to reduce the size of the logo on mobile but it seems to leave the space the same. Can you tell me what to add to also compress that space? here’s a pic. 
thanks!

On 7/30/2021 at 4:16 AM, rachella said:

Thanks but no need to fix - I’ll be deleting that section. I have just been working on the shop page until now and will update the rest soon.

I do have one question I’m sure you can help me with though!

It’s about reducing the spacing around logo in the footer (when shown on mobile). I’ve added CSS to reduce the size of the logo on mobile but it seems to leave the space the same. Can you tell me what to add to also compress that space? here’s a pic. 
thanks!

 

Hi. Which CSS did you add?

On 8/1/2021 at 12:22 PM, tuanphan said:

Hi. Which CSS did you add?

/* Resize footer images */
 @media screen and (max-width: 640px) {

footer .sqs-image .sqs-image-content img, footer .image-block {

    transform: scale(0.5)

}}

On 8/3/2021 at 8:13 AM, rachella said:

/* Resize footer images */
 @media screen and (max-width: 640px) {

footer .sqs-image .sqs-image-content img, footer .image-block {

    transform: scale(0.5)

}}

 

It looks like you added new code

but the code is invalid

change

Quote

margin: 1 auto;

to

Quote

margin: 1px auto;

On 8/4/2021 at 5:23 PM, tuanphan said:

It looks like you added new code

but the code is invalid

change

to

 

thank you 🙂

On 8/4/2021 at 5:23 PM, tuanphan said:

It looks like you added new code

but the code is invalid

change

to

 

Hello again - you helped me with spacing before, I am hoping you can assist with one more section!

I would like to reduce the padding between two pages (not all through the site, just two specific pages). See attached image as reference.

I would like the space reduced between the line of one page, and the text 'Building your dream event...' of the next page.

https://eventkit-test-site.squarespace.com

I'm sure it's a simple CSS design fix but I can't work it out.

Thanks in advance!

Rachella

On 9/17/2021 at 7:18 AM, rachella said:

Hello again - you helped me with spacing before, I am hoping you can assist with one more section!

I would like to reduce the padding between two pages (not all through the site, just two specific pages). See attached image as reference.

I would like the space reduced between the line of one page, and the text 'Building your dream event...' of the next page.

https://eventkit-test-site.squarespace.com

I'm sure it's a simple CSS design fix but I can't work it out.

Thanks in advance!

Rachella

 

Where is page in screenshot? I don't see them on homepage

On 9/20/2021 at 8:58 AM, tuanphan said:

Where is page in screenshot? I don't see them on homepage

hello!

I'm sorry to confuse you, I changed the text to: EVENT MANAGEMENT TOOLS FOR YOUR CREATIVE BUSINESS

I am referring to the space between page above it. The spacing between those pages is not good when viewed on mobile. I have taken a new screen shot for clarity.

I've looked up how to reduce the spacing between pages more generally, but I think that's not what I want to do across the entire site, because it looks fine elsewhere. It's just between these two pages - it looks wrong when viewed on mobile.

thanks for your help!

Rachella

On 9/21/2021 at 9:25 AM, rachella said:

hello!

I'm sorry to confuse you, I changed the text to: EVENT MANAGEMENT TOOLS FOR YOUR CREATIVE BUSINESS

I am referring to the space between page above it. The spacing between those pages is not good when viewed on mobile. I have taken a new screen shot for clarity.

I've looked up how to reduce the spacing between pages more generally, but I think that's not what I want to do across the entire site, because it looks fine elsewhere. It's just between these two pages - it looks wrong when viewed on mobile.

 

thanks for your help!

Rachella

 

 

 

 

Add to Design > Custom CSS

@media screen and (max-width:640px) {
section#portfolio-home-2>div {
    padding-bottom: 0;
}
section#portfolio-collection-1>div {
    padding-top: 0;
}
}