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

Responsive Results with random values

@TwixGamer00

Desktop design screenshot for the Results summary component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


  • How should I do the footer on the mobile version? I couldn't get it done so I made 2 footers, 1 for desktop, and 1 for mobile. How can I place the footer at the bottom of the page without messing up the layout

  • All other feedback is also welcome, such as things I should do differently or things I did which should avoid doing

Community feedback

Nathan 90

@Ayddan

Posted

Hi TwixGamer00,

You struggle because your are using several parameters that are not usefull in your case

You footer

For your footer just remove the postion absolute and the transform

Your body

Your body have a display: flex; so add a flex-direction: column;

With that your component and your footer will display in one column

Your second footer

You can just remove it

Change the background color

For your mobile version just change the background color to white and it will to the trick

Ask if you need any precisions.

Hope it help

Marked as helpful

1

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