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

Using positions and flexbox css only

@ayechico21

Desktop design screenshot for the Profile card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

@danielemanca1983

Posted

Hi Maneesh,

I am here providing you some constructive feedback in regards to your submitted solution.

First of all I would like to say that your solution is pretty good, however here are a few suggestions which would enable you to further improve the solution:

  1. your .top-left-corner and .bottom-right-corner divs should be slightly readjusted, if you look at the actual design, their position does not match exactly, on your solution. When you will be applying for job and be assigned with a technical challenge, you will greatly risk not to get the job if you have mismatches between given UI designs and your solution.

  2. Inside the .stats div, you could make use of BEM CSS classes, for instance you have nested divs inside of .stats, which have no class, you can look into BEM here, although it's not a must to use it, in my opinion it's important to know what it is and why it's useful.

Other than that it's pretty good, :)

Marked as helpful

0

@ayechico21

Posted

@danielemanca1983

Hey Dan, Appreciate the feedback. I messed my screen size calc and need to make the design element responsive to screen size. I used position first time , I'll read about it more and then work in it.

secondly, I have never heard of BEM CSS classes, I will definitely look into them.

Thanks Dan

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