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 with vanilla css

P
Fluffy Kas 7,735

@FluffyKas

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


Hey, I'm a newbie so any feedback is much appreciated, especially regarding the background circles which I couldn't make responsive. Thanks!

Community feedback

P
ApplePieGiraffe 30,545

@ApplePieGiraffe

Posted

Hello, Fluffy Kas! 👋

Good work on this challenge! 👍

This is just a small thing for your HTML—I think you can make your markup a little more semantic by using an <article> tag for the profile card (since it is a self-contained element) and a heading tag for an appropriate element inside it (rather than using just <div>s for mostly everything). 😉

And I would suggest looking into using viewport units to position the background images in this challenge (since that will allow you to position them images so that they don't move around so much when the screen is resized). 🙂

Keep coding (and happy coding, too)! 😁

1

P
Fluffy Kas 7,735

@FluffyKas

Posted

I managed to fix the background images and I'll definitely look into how to write more semantic HTML. :) Thanks for your help, much appreciated!

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