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

3 Column Preview Card Component

@codeDavidC

Desktop design screenshot for the 3-column preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


I'm not too sure what breakpoints I should use (since there are different sizes and orientations portrait/landscape).

What breakpoints do you recommend?

And How do I get the footer to stick to the bottom? I tried position absolute but it didn't work how I wanted.

Community feedback

Jordan 180

@GitNutts

Posted

A common breakpoint is 768px and then if you wish to change something slightly on mobile then you could add another breakpoint at 425px.

What do you mean stick to the bottom? The footer is below the card in the desired place from what I can see.

Marked as helpful

1

@codeDavidC

Posted

@gitnutts I think on mobile the footer looks fine. But on desktop it still under but not at the bottom.

And thanks for the breakpoint recommendation.

0

Jordan 180

@GitNutts

Posted

@codeDavidC You could use position: fixed, bottom: 0 on the footer for desktop if you wish to keep it at the bottom.

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