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 comment

Recommended Posts

  • 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;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 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;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 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...

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 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;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 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.

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 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 comment
  • 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.

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 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;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 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 comment
  • 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.

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 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;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 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;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

Link to comment
  • 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 comment
  • 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?

Email me if you have need any help (free, of course.). Answer within 24 hours.

How to: Setup password & share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care - Learn CSS - Custom Popup - Testimonial Slider

I'm Tuan, blogger/owner of a free library for children in Vietnam. Helping the community is a hobby. Contact me via email.

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...