Reaching back to Avenue template, full width footer issues

Hello. Yes, I'm still on Avenue. I will eventually switch over to 7.1, but this is still doing a great job for me so I'm not gonna put it down until I absolutely need to.

I am looking to do something and what I have found (in a few places) doesn't quite do the trick...

I want my footer to span the entire width of the page, the way the header does. (the orange line will help illustrate that)

I found this code (below), but making #canvas max width causes the entire site to, and that's not what I want. I really want to keep the width of the site as is, just making the footer full-width.

Another thing I would like to do is remove alllll of this extra space at the end of the page... I can't figure out where it's coming from, but there's a lot at the bottom of the footer when viewing on desktop (mobile seems to be fine for some reason)! Ideally I would like to remove the bottom 80 pixels of the page/footer on desktop.

Any help on this would be soooooo greatly appreciated. Thank you!

( note - there is some weird stuff on this website - please don't visit if you're offended by drag and LGBTQ art )

www.danllinehan.com

/* Footer Full Width */
#canvas {
    max-width: 100%;
    position: relative;
}
#footer {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 60px;
}

6 hours ago, tuanphan said:

Remove your code & use this new code

footer#footer {
    position: absolute;
    left: 0;
    width: 100%;
}
body {
    overflow-x:hidden;
}
    

 

That did it! Sometimes the answer just slaps me in the face. Thank you!