The footer is at the bottom as intended on my Home page and Form page. But something is causing the footer to appear at the top of my Gallery page. I'm assuming it's an issue with specificity or one of my selectors. But I'm new to this and so far everything I've tried hasn't resolved the issue.
My footer code is basic so something else must be forcing it to the top. I checked the Gallery ID's and none of them appear to be effecting my footer element.
footer {
background:#333333;
color:#FFFFFF;
padding:10px;
}
/* || gallery-items */
.gallery-item {
text-align:center;
width:300px;
height:300px;
margin:10px;
background-color:#ADD8E6;
border:10px solid #333333;
border-radius:4px;
float:left;
object-fit:contain;
}
/* || gallery item hover */
.gallery-item:hover {
border-color:#03A9FC;
}
Here is a link to my Replit. I apologize for not being able to asses what the root of the issue. This is my first week doing CSS styling.