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

Tarunaβ€’ 305

@Tiyana19

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


Please provide your feedback and suggestions.

Community feedback

visualdennisβ€’ 8,255

@visualdenniss

Posted

Hello Tinker,

nice job with the challenge and also with the background images! Few suggestions for further improvement:

  • background-color does not seem to match the design, u can use this: background-color: #19a2ae;

  • you dont need height: auto; for the .card-container, as height property has default value of auto already. Similarly you don't need width: 100vw for the main. Also it is better to replace height: 100vh with min-height: 100vh to not to set any constraints.

  • the divider line seems to be too thick, you can simply remove the border on it.

  • The about text content (likes, followers) don't seem to be aligned in the center due to uneven paddings.

Hope you find this feedback helpful!

Marked as helpful

1

Tarunaβ€’ 305

@Tiyana19

Posted

@visualdenniss Thank you so much about the divider just want to ask should remove only border-top or whole border and then give it a height ?

1
visualdennisβ€’ 8,255

@visualdenniss

Posted

@Tiyana19 It already looks much better, so no need to do anything else in my opinion, what you did is good enough.

Marked as helpful

1

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