Frontend Mentor - Profile card component

Community feedback

• 

  Travolgi 🍕•31,400

  @denieldenPosted almost 3 years ago

  Hi Pascal, good job!

  I had a look at your solution and I have a few suggestions for you:

  • To center the cards on the page try using Flexbox, it can help you better: give the flexbox and height properties to the body and remove all margin from the card class.
  • Note: Flexbox aligns to the size of the parent container. You can use the vh measurement for the height... Viewport Height handles the sizing of an element in relation to the height of the browser window.
  • the label tag should be used for input nomenclature not for p tag.

  Hope this help ;) And keep it up!

  Marked as helpful

  1

  ---

  

  pascal de creator•120

  @pascall-de-creatorPosted almost 3 years ago

  Hey Deniel Den,

  Thanks for the tip, I have already implemented that but the I am yet to push it to my Github repo. Thanks anyways :)

  1
• 

  Web Wizard•5,690

  @rsrclabPosted almost 3 years ago

  Hi, @pascall-de-creator ~

  Congratulate on your solution to the challenge on FM platform. I have studied your work carefully and learned a lot from it.

  Here are some of the tips I like to provide.

  • On smaller devices, card goes over screen, and I think max-width: 100% can solve this issue.
  • Please try BEM for naming element classes. It will help you a lot on bigger projects.
  • For background, I suggest you to use css background-image property or pseudo elements like ::before, ::after.

  https://www.frontendmentor.io/solutions/profile-card-solution-m-cH4D2Lp

  Here is my solution to this challenge, and if it can help you even a bit, it would be happy to me.

  Cheers ~

  1

  ---

  

  pascal de creator•120

  @pascall-de-creatorPosted almost 3 years ago

  @tymren608

  Thank you for the advice... very much appreciated :)

  0