Decreasing Section Padding Squarespace 7.1

On 4/26/2022 at 8:24 AM, tuanphan said:

Use this CSS

@media screen and (min-width:992px) {
[data-section-id="624a6f5e8ddad257b3c5b093"] {
    padding-top: 170px !Important;
}
}

Thanks, that worked on desktop, but see attached screenshot for what happens on mobile. Could you advise how to fix this on mobile too?

Url: https://pepper-pelican-gr94.squarespace.com/about

PW: ValuesAndFrames

On 5/2/2022 at 5:22 PM, CommonCause said:

Thanks, that worked on desktop, but see attached screenshot for what happens on mobile. Could you advise how to fix this on mobile too?

Url: https://pepper-pelican-gr94.squarespace.com/about

PW: ValuesAndFrames

Use this new code

@media screen and (min-width:992px) {
[data-section-id="624a6f5e8ddad257b3c5b093"] {
    padding-top: 170px !Important;
}
}
@media screen and (max-width:990px) {
[data-section-id="624a6f5e8ddad257b3c5b093"] {
    padding-top: 60px !Important;
}
}

On 5/4/2022 at 11:59 PM, tuanphan said:

Use this new code

@media screen and (min-width:992px) {
[data-section-id="624a6f5e8ddad257b3c5b093"] {
    padding-top: 170px !Important;
}
}
@media screen and (max-width:990px) {
[data-section-id="624a6f5e8ddad257b3c5b093"] {
    padding-top: 60px !Important;
}
}

 

Alas no, that just made it worse - see attached screenshots. Grateful for any more ideas you might have. Thanks!

Url: https://pepper-pelican-gr94.squarespace.com/about

PW: ValuesAndFrames

22 hours ago, CommonCause said:

Alas no, that just made it worse - see attached screenshots. Grateful for any more ideas you might have. Thanks!

Url: https://pepper-pelican-gr94.squarespace.com/about

PW: ValuesAndFrames

 

You can adjust number in the code

On 5/6/2022 at 12:19 PM, CommonCause said:

@media screen and (min-width:992px) {
[data-section-id="624a6f5e8ddad257b3c5b093"] {
    padding-top: 170px !Important;
}
}
@media screen and (max-width:990px) {
[data-section-id="624a6f5e8ddad257b3c5b093"] {
    padding-top: 60px !Important;
}
}

Thanks but I've adjusted the 170 and 60 px numbers to all different values and the appearance doesn't change? Grateful for any more explanation, thanks.

site: https://pepper-pelican-gr94.squarespace.com/

PW: ValuesAndFrames

19 hours ago, CommonCause said:

Thanks but I've adjusted the 170 and 60 px numbers to all different values and the appearance doesn't change? Grateful for any more explanation, thanks.

site: https://pepper-pelican-gr94.squarespace.com/

PW: ValuesAndFrames

Use this

@media screen and (min-width:992px) {
[data-section-id="624a6f5e8ddad257b3c5b093"] {
    padding-top: 170px !Important;
}
}
@media screen and (max-width:991px) {
[data-section-id="624a6f5e8ddad257b3c5b093"] {
    padding-top: 110px !Important;
}
}

@creedon

I have received help decreasing the section height of the my portfolio, although it effects the hover: follow cursor where is isn't following the cursor properly. Do you know of any solutions to this?

I also need help reducing the section height for mobile?

https://www.rotaterecordings.com/portfolio-3

On 6/16/2022 at 12:52 AM, Indi said:

although it effects the hover: follow cursor where is isn't following the cursor properly.

I don't have a solution but an observation. I could see the issue you are talking about. When I checked the portfolio hover effect on my test site. I did not see the issue.

So locally I disabled the custom CSS for your site, reloaded the page, and it got better.

I'm assuming that the hover effect is being calculated by SS and the modifications you made with CSS to the section height may have thrown those calculations off. The one thing that makes me think that, is at first I just disabled your CSS and there wasn't much change. But when I did the reload, it got better.

@creedon Would you suggest reducing the vertical spacing another way? Do you know how I can reduce it for mobile view?

Thanks!

12 hours ago, Indi said:

Would you suggest reducing the vertical spacing another way?

The only thing I can suggest at this point is to use the built-in vertical height setting. As I assume that SS wouldn't have a problem with it's calculations.

what's the coding for reducing the padding in the intro section on a particular page?  I had to change the intro padding for my home page for a video but it messed up some other pages that I want to alter singularly now if I can instead of site wide.

hi there can someone help I have the same problem I want to reduce the space between sections

1 hour ago, bardo said:

I have the same problem I want to reduce the space between sections

Please post the URL for a page on your site where we can see your issue.

A link to the backend of the your site won’t work for us, i.e. a url that contains /config/.

Please set up a site-wide password, if your site is not public and you've not already done so.

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site.

Please read the site-wide password and how to share a link documentation to understand how they work.

We can then take a look at your issue.

You may find How to post a forum question post useful.

1 hour ago, creedon said:

Please post the URL for a page on your site where we can see your issue.

A link to the backend of the your site won’t work for us, i.e. a url that contains /config/.

Please set up a site-wide password, if your site is not public and you've not already done so.

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site.

Please read the site-wide password and how to share a link documentation to understand how they work.

We can then take a look at your issue.

You may find How to post a forum question post useful.

Hi Thanks for your help, 

the url under construction is this

https://rhombus-corn-8w9z.squarespace.com/

pass: 2023

As I mentioned earlier I am happy with the left / right margings of the page.. but I would like to reduce the padding beatween the section to a very small padding

At the moment if I change the margins it links everything .. I will like to change only the padding betwenn sections without affecting left / right margins of the pages..

On 3/21/2023 at 10:14 PM, creedon said:

Please post the URL for a page on your site where we can see your issue.

A link to the backend of the your site won’t work for us, i.e. a url that contains /config/.

Please set up a site-wide password, if your site is not public and you've not already done so.

Post the password here.

Adding a site-wide password does not allow anyone to alter your site. It only allows those with the password to see your site.

Please read the site-wide password and how to share a link documentation to understand how they work.

We can then take a look at your issue.

You may find How to post a forum question post useful.

Hi there just checking if you have been able to access my website and if you think there is a solution for it

thanks Marsio

1 minute ago, bardo said:

checking if you have been able to access my website and if you think there is a solution for it

I did look and I don't have a solution as this time. Perhaps another forum member will have something for you.

8 minutes ago, creedon said:

I did look and I don't have a solution as this time. Perhaps another forum member will have something for you.

Hi there thanks. What do you think is that makes it diffucult to find a soultion?

thanks

2 hours ago, bardo said:

What do you think is that makes it diffucult to find a soultion?

My usual attack on a problem like this is to go after changing margin and padding spacing. There was a lot of padding around the section on that page but when I tried shrinking them them the videos became distorted.

It appears you've gotten around that issue by pulling all the videos into one section.

Hello,

I can see many people have a padding request. Apologies for adding to the list. I have been looking at the answers trying to find a solution for what I need without success. It seems like when I modify the CSS code in Home/Design/custom CSS, nothing happens. If I even try to change the default CSS code I have, nothing seems to change. (see attached):

I am trying to reduce the vertical padding between a blank section, which has an image, and the lower section which is a gallery section. See attached. Ideally I would like to reduce the padding of the gallery section to match the gap between the smaller photos within that gallery section. (this page is a project)

I have used the section id pointer in the CSS code in the Home/Design/custom CSS window, but as I said earlier, nothing seems to happen when I either change or input code in there. Am I missing something? Many thanks

Found the solution: If I remove the default CSS code and add this: 

section[data-section-id="63d151a94497e9427a8685cb"] .content-wrapper {
  width: 100% !important;
  padding-top: 1vw;
}

section[data-section-id="63d151a94497e9427a8685cb"] .gallery-masonry {
  padding-top: 0px;
}
 

it seems to work. Is this safe proof for my website? I have no knowledge of CSS code, just testing things. This is for this section only though and I am wondering if removing the default CSS code is also a good idea. thanks

1 hour ago, BobbySmith said:

Is this safe proof for my website?

No custom code is safe proof. SS makes changes to their platform all the time.

However, data-section-id have been one of the more stable elements on v7.1.

Space between sections

Hello and welcome. I have a request and a question. I want to reduce the space between sections. I see that in DevTools when I change the option "padding-top: 10vmax; - to 0vmax, then everything goes up nicely.

What should be the CSS code to make the squarespace go up?
I will be grateful for help, because I see that this place on the forum has a lot of solved problems and a lot of kind people.
Regards

On 5/10/2023 at 6:06 PM, Slawek_23 said:

Space between sections

Hello and welcome. I have a request and a question. I want to reduce the space between sections. I see that in DevTools when I change the option "padding-top: 10vmax; - to 0vmax, then everything goes up nicely.

What should be the CSS code to make the squarespace go up?
I will be grateful for help, because I see that this place on the forum has a lot of solved problems and a lot of kind people.
Regards

I think this is List Section Padding. Can you share link to page? We can check easier

I'm also having trouble removing the margins from the bottom of my section. It looks fine in edit mode but when I go to the actual site, there's far too much blank space. I've tried injecting some of the codes with my id's but obviously doing something wrong.

https://www.anthologyofcrumbs.com/contact

Thanks in advance!

18 hours ago, weecancuk said:

I'm also having trouble removing the margins from the bottom of my section. It looks fine in edit mode but when I go to the actual site, there's far too much blank space. I've tried injecting some of the codes with my id's but obviously doing something wrong.

https://www.anthologyofcrumbs.com/contact

Thanks in advance!

You mean this space?