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

Pure HTML & CSS - First Challenge

@AlanSeyfir

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! This was a fun challenged, this was my first time to make an approach to mobile first and make responsive. I was afraid about responsive. Welp more practice to improve.

Community feedback

Astrid 100

@astridv

Posted

Hi Alan!

Good job on the challenge 👏 I think it looks very nice on both desktop and mobile 😄 The transition from large to smaller screens is a bit choppy (first it is one size before jumping to another). I actually think you could simplify your code by removing your media queries, and just keeping the max-width property in this case as the card layout doesn't change.

The design looks really good. To get it even closer you could consider reducing the padding in your person-bio class to remove some white space.

Also, quick note on the strong tag. This tag is used to define text with strong importance in a document. If the text isn't of special importance, it is better to use the <b> tag or add a css style with font-weight: bold.

Hope this helps and keep up the good work 😄

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