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

My Solution to Profile Card Component Challenge HTML SCSS

Artur 145

@arturpawlowski5

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 All,

I am really new to coding and would appreciate any feedback!

This is my First Challenge Here.

I try to make this Challenge as close to the original but finally, I change some CSS to:

  1. Add borders,
  2. Add shadows,
  3. Make some small animations.

Right now I would like to make this project responsive.

Can you tell me:

  1. How to keep background circles in the same position when the viewport is changed to mobile?

Hope someone will be able to assist or point out the problem!

Thank you!

Community feedback

P
ApplePieGiraffe 30,545

@ApplePieGiraffe

Posted

Greetings, Artur! 👋

Congratulations on completing your first Frontend Mentor challenge! 🎉 Nice job on this one! 👏

I suggest adding and positioning the background images in this challenge using CSS background images. It'll keep those images out of your HTML, which will make your markup cleaner, and I think it's a little easier to manage the background images, then.

If you want to keep the background images more or less in the same place when the screen is resized, try positioning the background images using viewport units. 😉

Keep coding (and happy coding, too)! 😁

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