hide footer from page and get rid of the space it consumed - CSS

Hey all,

I need your help with CSS.
I'd like to remove the footer section completely only from one page. 

I've added css to hide the contents of the footer, which works:
 

#collection-633ccc097841872e8b279ad4
  footer.sections {
  	display: none !important;
  }

But, it leaves a blank space where the footer contents was. The section above has a backgrouynd image, but it doesn't go to the bottom of the screen because the footer section is still there.

I dont have a business plan, so this will need to be achieved in CSS only.

It's the /home page.

www.dustin.land/home
site password: SQtemp123

Thank you! 😊

thank you! This solved the issue!

Hi @tuanphan, I've applied your code above, the footer space is smaller but there is still an empty space at the bottom of my page. Any idea? I've tried code injection (display: none) and deleting the footer section, both still leave an empty space.

Homepage on

https://tuatara-cello-3kr6.squarespace.com/

password: wpGNeG9jZ5diGiM

Thanks in advance!

On 10/15/2023 at 3:09 AM, melody495 said:

Hi @tuanphan, I've applied your code above, the footer space is smaller but there is still an empty space at the bottom of my page. Any idea? I've tried code injection (display: none) and deleting the footer section, both still leave an empty space.

Homepage on

https://tuatara-cello-3kr6.squarespace.com/

password: wpGNeG9jZ5diGiM

 

Thanks in advance!

You mean black gap under first section on homepage?

14 hours ago, tuanphan said:

You mean black gap under first section on homepage?

@tuanphan Yes exactly! Any idea how to get rid of it? It seems to be the fluid container is still there, maybe that is causing the gap?

I'm trying to have a dynamic full screen with the first section, I've managed to do this with

body#collection-6520141b2bcdcb43998d4273 section {
    height: 100vh;
}

and hid the footer section with

.homepage #footer-sections {
    display: none !important;
}

but there is a gap at the bottom.

On 10/17/2023 at 12:28 AM, melody495 said:

@tuanphan Yes exactly! Any idea how to get rid of it? It seems to be the fluid container is still there, maybe that is causing the gap?

I'm trying to have a dynamic full screen with the first section, I've managed to do this with

body#collection-6520141b2bcdcb43998d4273 section {
    height: 100vh;
}

and hid the footer section with

.homepage #footer-sections {
    display: none !important;
}

but there is a gap at the bottom.

Use this CSS code to remove black gap

body.homepage {
    overflow: hidden;
}

On 10/19/2023 at 10:31 AM, tuanphan said:

Use this CSS code to remove black gap

body.homepage {
    overflow: hidden;
}

 

Thanks! It seems to have disappeared on its own, then came back again... Will see if it still happens once started the subscription.

Edit: this worked! A smaller black line kept appearing and disappearing is something else.