Broadway Project

Get Help CSS
#1

https://www.codecademy.com/workspaces/6393b9edda720aa6a3a8b526

Hi all,

I just completed the Final Project in Fundamentals of CSS, and I would like a code review and some help with the final extra credit task, which asks to have the footer fix itself to the bottom of the page, to stay visible as you scroll up and down.

I followed similar steps to how I did it to the header but I can’t seem to figure it out for the footer in this project. Your advice or assistance is appreciated!

Thanks,
Luis

1 Like
#2

Hello!

If you want your footer to be sticky like the header, you’ll want to adjust your CSS like so:

footer {
    background-color: #333;
    color: #fff;
    padding: 8px 0;
    position: fixed;
    bottom: 0;
    width: 100%;
}

And then remove absolute from your footer p and fixed from the footer div.

#3

Hi there,
I managed to get the same results in the Broadway Project in a much easier way. Please look at my code and guide me or suggest to me, why they have not used position sticky…?

header {
background-color: #333333;
position: sticky;
top: 0;
}
I’ve used the same code for the footer. It works fine. I was required to use z-index, width: 100%; to the header, I was not needed to touch , and got the same results.

#4

here is the link to my Broadway Project

Broadway (forked) | Default Workspace | Codecademy

#5

Thanks for this. My padding was 30 for top and bottom