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 using HTML5 and CSS3

@joseeduardorp

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


I couldn't keep the bottom circles fixed. Any tips?

Community feedback

P
ApplePieGiraffe 30,545

@ApplePieGiraffe

Posted

Hey, José Eduardo! 👋

Just wanted to say congratulations on completing your first Frontend Mentor challenge! 🎉 You've done a nice job on this one! 👍

Keep coding (and happy coding, too)! 😁

1
Aayush Sood 1,165

@soodaayush

Posted

Your website is very good! There are a few things that you can improve on.

  1. The shadows around the box are a bit too strong. I suggest toning it down.

That really all I have to say.

Happy Coding!

1

@joseeduardorp

Posted

I changed the color of the eyeshadow and made it a little lighter, thanks for the feedback

0

@MiaSinger

Posted

Hey, I had the same issue and the comment from this post here was very helpful: https://www.frontendmentor.io/solutions/profile-card-component-using-html-and-css-2vDELrQBk

so I solved it in a similar way: background-image: url("./images/bg-pattern-top.svg"), url("./images/bg-pattern-bottom.svg"); background-repeat: no-repeat, no-repeat; background-color: hsl(185, 75%, 39%); background-position: right 50vw bottom 36vh, left 50vw top 40vh;

it helped me to have a look at the docs of background-position and play around a little: https://developer.mozilla.org/en-US/docs/Web/CSS/background-position

1

@joseeduardorp

Posted

thanks, I managed to solve the problem

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