Positioning Header, Main and Footer
I was following along some courses and I got lost with positioning, here is my problem https://codepen.io/username55fda/pen/jEqmwyz .
Lets say you have a three main sections for simplicity, Header main and footer. I was using flex column which works perfectly but I started to add disappearing mobile button and tried to put a transparent header above the main section and i lost track.
Instead I used position sticky for the header position absolute for the button, its kinda working but I don't understand why, I watched kevins deep dive into position video.
And when I try to add like a main button at the bottom of the main section its all over the place when I try positions, you those buttons that are in the bottom center of some big websites eg. enroll now or Get.......... I'm also aware the z-index number from most front to back.
So I'm trying to make the header at the top and above the main section of cards and the mobile button next the header on the far right, and footer all the way in the end. Apple website kinda has what I want and I provided an image.
Thank you in advance
Lets say you have a three main sections for simplicity, Header main and footer. I was using flex column which works perfectly but I started to add disappearing mobile button and tried to put a transparent header above the main section and i lost track.
Instead I used position sticky for the header position absolute for the button, its kinda working but I don't understand why, I watched kevins deep dive into position video.
And when I try to add like a main button at the bottom of the main section its all over the place when I try positions, you those buttons that are in the bottom center of some big websites eg. enroll now or Get.......... I'm also aware the z-index number from most front to back.
So I'm trying to make the header at the top and above the main section of cards and the mobile button next the header on the far right, and footer all the way in the end. Apple website kinda has what I want and I provided an image.
Thank you in advance
A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.
36,263Members
Resources
Similar Threads
Was this page helpful?
