Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Grid, media queries

John 210

@gt78x

Desktop design screenshot for the Testimonials grid section coding challenge

This is a solution for...

  • HTML
  • CSS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


How do I prevent the footer from hovering on other elements on small screen size?

Community feedback

@noonecaresman023

Posted

Looking over your html, mainly your footer, since you already used the footer element you don't have to put a div inside the footer you can just put p element or a tag element. To fix your problem, your body tag should look like: body{ min-height: 100vh; position: relative;} then styling your footer would be footer{position: absolute; top: 100%; bottom: 0;} it should hopefully solve your problem. I'd advise you to use semantic html instead of using divs for better readability and delete the footer style inside your html and instead put it in your css file.

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord