Jump to content

Decreasing Section Padding Squarespace 7.1

Go to solution Solved by tuanphan,

Recommended Posts

14 hours ago, clairemichelle said:

Hi everyone. Hoping to get some support in this area as well. Here is my home page. The gap after the testimonials section is really large and I've had no success in decreasing it. Any tips/tricks would be so greatly appreciated!!! 

Here is link: https://www.mamamedicine.com 

 

Add to Home > Design > Custom CSS

div#block-yui_3_17_2_1_1597334272726_8389 {
    padding-bottom: 0;
}

 

11 hours ago, ksachse said:

Same snafu, having a difficult time reducing padding between sections on 7.1 site.

https://celery-turquoise-kfwp.squarespace.com/

PS: arnold

Your site is private.

Add to Home > Design > Custom CSS

#page section .content-wrapper {
	padding-top: 1px;
	padding-bottom: 1px;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

Hi, I have a little padding issue in one of the sections of my website. The section is "Clients" and I have a gallery slider with logos, the issue is just in the mobile version, the slider has too much padding at the top/bottom. I'd love to decrease that space. I tried a few CSS lines I found in this forum but it didn't work. Could you please help me with this?

https://www.franciscoortigosa.com/

Password: Web2019!

 

Many thanks

Screen Shot 2020-08-16 at 19.01.42.png

Link to comment
2 hours ago, frortigosa said:

Hi, I have a little padding issue in one of the sections of my website. The section is "Clients" and I have a gallery slider with logos, the issue is just in the mobile version, the slider has too much padding at the top/bottom. I'd love to decrease that space. I tried a few CSS lines I found in this forum but it didn't work. Could you please help me with this?

https://www.franciscoortigosa.com/

Password: Web2019!

 

Many thanks

 

Add to Home > Design > Custom CSS

@media screen and (max-width:767px) {
.gallery-slideshow {
    margin-bottom: 0;
}
[data-section-id="5eb54572851e5d35a83b5b0f"] {
    min-height: unset !important;
    height: 25vh;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

I am having the same issue. I would really like to be able to tweak the space between sections and blocks without any coding. Although I am new to Squarespace, am I right that the 7.0 templates gave you more flexibility in this? Is this something Squarespace is addressing in future upgrades? I went with 7.1 because I assume that SS will be adding features.

Link to comment
23 hours ago, willrothfuss said:

I am having the same issue. I would really like to be able to tweak the space between sections and blocks without any coding. Although I am new to Squarespace, am I right that the 7.0 templates gave you more flexibility in this? Is this something Squarespace is addressing in future upgrades? I went with 7.1 because I assume that SS will be adding features.

In SS 7.1 you can reduce height to reduce padding.

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
  • 4 weeks later...

@tuanphan 

Hi, I'm having a hard time minimizing the space between section blocks (so there is less scrolling and the content is closer together). Since I have both an image and text it shows as two separate blocks, even though it is one section. How can I minimize the space so the content could be closer together? Thanks so much! 

Link to comment
On 9/14/2020 at 7:08 PM, EllieY said:

How can I find what my block ID are, so then I can use the code? Thank you

Use this https://chrome.google.com/webstore/detail/squarespace-id-finder/igjamfnifnkmecjidfbdipieoaeghcff?hl=en

On 9/17/2020 at 4:05 AM, KimPaola said:

@tuanphan 

Hi, I'm having a hard time minimizing the space between section blocks (so there is less scrolling and the content is closer together). Since I have both an image and text it shows as two separate blocks, even though it is one section. How can I minimize the space so the content could be closer together? Thanks so much! 

Can you share site url?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
On 9/29/2020 at 4:00 PM, niallybin said:

Hello!

Yet another person with this problem, trying to control the spacing between sections:

https://vuvuzela-carrot-a3lj.squarespace.com/8x8-intro

tried a few of the solutions above but they all seem to control internal padding, rather than the white space between sections.

thanks for any help!! 

Your site is private. Can you setup password?

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
20 hours ago, WLGP said:

Hi,

Like a lot of people, I have issue to reduce the padding between the caption of my slideshow and the next section.

https://ukulele-gopher-exfr.squarespace.com/uncensored-slide-1?p

studio@gruenholtz.com

pw : Ingrid2020!

I have several pages with the same issue. Will I need to create a CSS for each page?

Thanks for your help

Don't post account info here.

You can setup site password & share url.

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment

@laurwhyyy Please give us the URL for the page where you are having an issue. If you've not already done so please set up a site-wide password. Post the password here and then we can take a look at your issue.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment

@laurwhyyy Add the following to Design > Custom CSS.

[data-section-id="5ec7eb8ae60b116c887ca45e"] .gallery-slideshow[data-show-captions="true"][data-thumbnails="false"] {

  margin-bottom: 50px;
  
  }

If you want the margin removed from all galleries site wide then remove "[data-section-id="5ec7eb8ae60b116c887ca45e"]".

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment

Hi there! Urgent!! 

I can't seem to code or do anything to close the gap between the text and the header. 

Is there any way to make this appear more proportional ? The text needs to be pulled upwards but I can't override the padding. 

 

thank you!

Screen Shot 2020-10-14 at 7.35.17 PM.png

Link to comment

@jasmineashli Please give us the URL for the page where you are having an issue. If you've not already done so please set up a site-wide password. Post the password here and then we can take a look at your issue.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment
Just now, creedon said:

@jasmineashli Please give us the URL for the page where you are having an issue. If you've not already done so please set up a site-wide password. Post the password here and then we can take a look at your issue.

Hi there! 

 

sayahlo.com 

password : daymaker 

the issue is only for the mobile. it's making me crazy. thank you!

Link to comment

@jasmineashli One thing you can try is change the SECTION HEIGHT and CONTENT HEIGHT like the following. Note that will change the desktop as well but perhaps not so much as to be a problem.

1333993953_ScreenShot2020-10-14at7_03_16PM.png.dd58f1985f21766d8669dd450eddd4e1.png

If that still isn't enough or you don't like the desktop effect add the following to Design > Custom CSS.

@media screen and ( max-width: 767px ) {

  .homepage .page-section.vertical-alignment--middle:not(.content-collection):not(.gallery-section).section-height--large>.content-wrapper,
  .homepage .sqs-layout .sqs-row .sqs-block:first-child

    {
    
      padding-top: 0 !important;

      }
  }

If that still isn't enough. Let us know we might have a few more tricks up our sleeves.

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.