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 COMPONENT

P
Thu Nguyen 240

@NgocMinhThuNguyen

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


Hi there,

This is an updated solution for this challenge.

I'd really appreciate it if you can have a look and give me some feedback on my work.

Thank you 🌻

Community feedback

Daniel 🛸 44,230

@danielmrz-dev

Posted

Hello, @NgocMinhThuNguyen! Your project looks very nice!

I have one suggestion on the background and the card:

  • The card is a little bit wider, try giving it a specific width setting, like 340px or 350px. You can do that, because this project does not have a mobile version.

  • Try that to make the background position even closer to the original project:

body {
    background-image: url("./images/bg-pattern-top.svg"), url("./images/bg-pattern-bottom.svg");
    background-repeat: no-repeat, no-repeat;
    background-position: right 52vw bottom 35vh, left 48vw top 52vh;
}

Hope it helps!

Other than that, your project looks great!

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