CSS Flexbox

Community feedback

• 

  Rio Cantre•9,690

  @RioCantrePosted almost 3 years ago

  Hello there! Nice work with this one. Viewing your solution, I would suggest the following for you...

  • Add these properties background-position: top center; and background-color: purple;(you make change the color value later) in the body for the position of the background.
  • Include margin-top: 5rem; in the .card rule set to align it on the center
  • Add media query for the mobile design and replace the background image with the smaller version
  • Remove the style tag in the head

  Overall you did well and Keep up the good work! Cheers!

  Marked as helpful

  1

  ---

  

  Sami NASRI•240

  @SilverWings47Posted almost 3 years ago

  @RioCantre Thanks for the feedback !

  1
• 

  Web Wizard•5,690

  @rsrclabPosted almost 3 years ago

  Hi, @SilverWings47 ~

  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.

  • I suggest you to try transition on hoverable elements like cancel button or proceed button.
  • Please try BEM for naming element classes. It will help you a lot on bigger projects.
  • I think background-position: center would be better.

  If it can help you even a bit, it would be happy to me.

  Cheers ~

  Marked as helpful

  1
• 

  Aadvik•1,250

  @Aadv1kPosted almost 3 years ago

  Hey! Good job on the actual card, it looks pretty great. Here are a few suggestions.

  • You can both have a background-image and a background-color this will remove the white background on your project
  • Background image can be manipulate in many ways, I would recommend you look at this line of my solution, also you should change the background on mobile to the mobile appropriate one. Best, Aadvik.

  Marked as helpful

  1