lethal grail
Hi! I'm having trouble getting the CSS right for my website. My footer bleeds into my #919151618753200138 section and I want them to stay separate. I can't figure out how to do it with google and chatgpt so I'm hopping in here to look for some help.
Anyone know how I can separate these?
https://codepen.io/jasonsnow/pen/xxodbPL
devout minnow
What are you trying to accomplish?
Your footer is "position: fixed" which sticks it in a permanent spot in the viewport... so it doesn't "bleed" per-se but rather overlays the body.
You may need to restructure a little bit depending on what you're trying to accomplish...
lethal grail
So on mobile it’s overlaying the images I have in my #919151618753200138 section, which I don’t want. I’m open to restructuring, but everything I’ve tried so far either moves the footer into a weird spot, or messes something else up. The footer doesn’t necessarily HAVE to be displayed in the viewport if it would make it easier to fix
devout minnow
Gotcha... the overlay occurs because there's not enough space to render the whole of the main content into the available space.
So, you can restructure such that you get a scrollbar only inside the white section OR you can move your footer to the bottom of the <section> - it would therefore not be displayed initially.
Either is viable and depends on what your requirements/preferences are.
lethal grail
this is maybe a dumb solution on my end, but I just added a couple <br> tags to the bottom of the sections and that looks like it gave enough space to fix it
devout minnow
well, if it works... it works!