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

flexbox

@gianback

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


any suggestion is accepted

Community feedback

@pikapikamart

Posted

Hey, awesome work on this one. Layout in general looks fine.

Some suggestions would be:

  • Always have a main element that will wrap the whole main content of the webpage. main elements helps users to properly navigate your content.
  • You don't have to use margin just to center the card properly. What you could have done is, on the .contenador selector, use min-height: 100vh on it. Then just remove the margin on the .tarjeta selector. This way, your content will always be centered dynamically.
  • The alt for the card wave image should have been using alt="" on it, since it is only decoration. If an image acts just as a decoration, use alt="" on it, but if the image adds content, then use a meaningful alt value.
  • The name of the person should have been a heading tag like h1 or h2.
  • The information below could have used ul element, since those are "list" of information about the user.

Just those mentioned, really great job on this one.

Marked as helpful

1

@gianback

Posted

@pikamart Oh thanks!!!!!

0
nageeb0 5

@nageeb0

Posted

nice

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