Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

Reduce Footer Padding


RoxyL

Question

Site URL: https://willowandwhitestudio.com/home

I am trying to reduce the padding of my footer using Squarespace 7.1. I have tried various CSS but can't seem to get it working.

I'd like the bottom section below the Instagram section to be about half the height that it currently is.

Can anyone please help?

password for the page is: workinprogress

I have tried using the following CSS and playing around with padding - it seems to work initially, but then once saved, it goes back to the original height.

 

footer#footer-sections {
  padding-top:-100px;
}

 

I also currently have the following code to make my instagram feed full width:

 

//*Full width IG footer*//

#footer-sections section:first-of-type {

  min-height: auto;

}

 

#footer-sections section:first-of-type .content-wrapper {

  padding: 0!important;

  max-width: 100%;

}

 

#footer-sections section:first-of-type .instagram-block {

  padding-bottom: 0!important;

  padding-top: 0!important;

}

 

Not sure if the code is interfering somehow? I'm still learning CSS!

Thank you!

Screenshot 2020-03-24 at 22.28.29.png

Edited by RoxyL
added info
Link to post
  • Answers 27
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Try adjusting Section Height first. If it doesnt work, add this code to Home > Design > Custom CSS [data-section-id="5e6e48b1a53943154aaf8783"] .content-wrapper { padding-bottom: 0

hi, was able to fix this by changing background color to transparent for all color ways (even dark/accent/black etc.)

Posted Images

Recommended Posts

  • 0

Add to Home > Design > Custom CSS

div#block-yui_3_17_2_1_1584969760368_21035+.row .spacer-block {
    padding-bottom: 0;
    padding-top: 0;
}

 

Link to post
  • 0

Thank you so much! How did you find the right selector to use? I use Google Chrome's Block Identifier but couldn't find that block ID.

Link to post
  • 0
2 minutes ago, RoxyL said:

Thank you so much! How did you find the right selector to use? I use Google Chrome's Block Identifier but couldn't find that block ID.

That block has no ID, you will need to know about the code to use the ID of another block, for the current block...

Link to post
  • 0
3 minutes ago, RoxyL said:

Thanks. How would I go about reducing the spacing between these two sections on the home page so that there is less white space?

 

 

Try adjusting Section Height first.

If it doesnt work, add this code to Home > Design > Custom CSS

[data-section-id="5e6e48b1a53943154aaf8783"] .content-wrapper {
    padding-bottom: 0 !important;
}
[data-section-id="5e6e4eb88afded74f541fbe2"] .content-wrapper {
    padding-top: 0 !important;
}

 

Link to post
  • 0
1 hour ago, sophieoc said:

Hi!

 

Would you please help with reducing the footer on this site, it's 7.0

Can you share link to your site? We can check easier.

Link to post
  • 0

@tuanphan

I have tried using your code above with the block ID for my site to remove the white space above the Insta feed but it doesn't seem to be working. I am currently using div#block-yui_3_17_2_1_1590766319551_24557 {
    padding-bottom: 0;
    padding-top: 0;
}

This removes bottom spacing but not top.

Any ideas greatly appreciated.

Thanks,

A

Untitled design (1).jpg

Link to post
  • 0
On 6/19/2020 at 7:00 PM, AvrilAnderson said:

@tuanphan

I have tried using your code above with the block ID for my site to remove the white space above the Insta feed but it doesn't seem to be working. I am currently using div#block-yui_3_17_2_1_1590766319551_24557 {
    padding-bottom: 0;
    padding-top: 0;
}

This removes bottom spacing but not top.

Any ideas greatly appreciated.

Thanks,

 

Each case needs different code. Can you share link to your site? I can check easier.

Link to post
  • 0
2 hours ago, StudioRhodes said:

@tuanphan Hello I would also like the padding in my footer to be much smaller. Can you please provide me with the block ID?

 

Link: studiorhodes.net

Password: services

Add to Home > Design > Custom CSS

footer.sections {
section {
    min-height: unset !important;
}
section .content-wrapper {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
}

 

Link to post
  • 0

Hello, I tried to reduce my footer by using this code but it caused blank space to appear as if there is not enough page for the website.  Any suggestions on how to reduce the footer but remove the blank space as well?  

 

My site URL is https://re-shft-sample-site.squarespace.com

Password: view

 

485374563_ScreenShot2020-09-02at11_11_53AM.thumb.png.9e6060f56223119df109b26d4b37d77e.png

 

footer.sections {
section {
    min-height: unset !important;
}
section .content-wrapper {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
}
Edited by re-shftstudios
Link to post
  • 0
On 9/2/2020 at 10:14 PM, re-shftstudios said:

Hello, I tried to reduce my footer by using this code but it caused blank space to appear as if there is not enough page for the website.  Any suggestions on how to reduce the footer but remove the blank space as well?  

 

My site URL is https://re-shft-sample-site.squarespace.com

Password: view


footer.sctions {
section {
    min-height: unset !important;
}
section .content-wrapper {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}
}

Do you still need help on this? If yes, can you take screenshot the padding? WE can check easier.

Link to post
  • 0
On 9/23/2020 at 1:41 AM, LayneD said:

I am running into  similar problem with my site. The footer section is way too large and I have no idea how to reduce it. comiccubes.com I’m using the Bedford template.

Add to Home > Design > Custom CSS

div#footerBlocks {
    margin-top: 0 !important;
}
.footer-inner {
    padding: 10px !important;
}

 

Link to post
  • 0
On 9/23/2020 at 6:37 PM, tuanphan said:

Add to Home > Design > Custom CSS


div#footerBlocks {
    margin-top: 0 !important;
}
.footer-inner {
    padding: 10px !important;
}

 

That worked perfectly. Thank you!

Link to post
  • 0
4 hours ago, Emma456 said:

Hi @tuanphan

I'm trying to alter the padding between my footer elements too - but can't seem to work out the code to do it. Would you be able to help? I'm looking to reduce the padding between the middle, navigation and bottom footer blocks. 

my website is www.stampdesignco.com and access password is spaceform1

Thanks in advance 🙂,

Emma

Add to Home > Design > Custom CSS

nav.Footer-nav {
    padding: 0 !important;
}
div#footerBlocksMiddle {
    padding-bottom: 0;
}
div#footerBlocksBottom {
    padding-top: 0;
}
div#block-yui_3_17_2_1_1603645721676_3198 {
    padding-bottom: 0;
}

 

Link to post
  • 0

hi @tuanphan

am also trying to remove extra grey space between the sections and footer across my site, have tried to minimize the footer padding at top, but doesn't seem to be working only enlarging the space. When I select L or 100 height for the section above it works, but I end up with too much white space which I don't want. Help much appreciated!

site: www.ysdm.studio
pass: YSDM2020

Screen Shot 2020-11-03 at 11.30.52 AM.png

Link to post
  • 0
22 hours ago, ysdm said:

hi @tuanphan

am also trying to remove extra grey space between the sections and footer across my site, have tried to minimize the footer padding at top, but doesn't seem to be working only enlarging the space. When I select L or 100 height for the section above it works, but I end up with too much white space which I don't want. Help much appreciated!

site: www.ysdm.studio
pass: YSDM2020

Can you share link to page in screenshot?

Link to post
  • 1
8 hours ago, bdk.nyc said:

Would love some help with this, as well (my first 7.1 site and some of my 7.0 CSS hacks aren't working). I'm looking to get the footer content width at 100%, but can't seem to find the right identifiers in the source code.

Site: https://eversage.squarespace.com/home
Pass: eversage

Thanks!

Add to Home > Design > Custom CSS

footer.sections .content {
    width: 100% !important;
}

 

Link to post

Create an account or sign in to comment

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


×
×
  • Create New...