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

Profile Card using Flex and custom CSS

Andy 520

@AndyAshley

Desktop design screenshot for the Profile card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Any feedback on the background images would be great. These were a pain to do when trying to make it responsive. The fixed 1440 and 375 were fine, but scaling looks bad lol.

Community feedback

@becckman

Posted

They were indeed a pain to get positioned correctly. What I did was adding the two images as img elements and positioned them absolute. I positioned them relative to the card instead of the body, this way I could get them to be in about the same position relative to the card on all resolutions.

I kept them the same position and size everywhere so definitely not a perfect solution, but felt like it did the job.

Marked as helpful

0

Andy 520

@AndyAshley

Posted

@becckman Thanks! I will keep that in mind next time! I tried a few different ideas but not the card itself. good thinkin!

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