Profile Card

Community feedback

• 

  Eugenia•950

  @JaneMorozPosted almost 2 years ago

  Hey! Your solution to this challenge is great! 💪

  I looked at you code. So I'd advice to remove position:absolute; from profile-picture and margin-bottom: 4rem; from top-background and then just add transform: translateY(-50%); to profile-picture.

  Keep it up! And good luck 🍀

  Marked as helpful

  1

  ---

  

  Swing95•180

  @Swing95Posted almost 2 years ago

  @JaneMoroz

  Hello Jane,

  thank you, that really worked :-)

  Is it possible to do it so that image does not take space after moving? When I use position absolute, it does not work then.

  I have fixed it by also using translateY(-40%); on my info class (name, age, location), because it took too big space and padding-margin were increasing my card size.

  Thank you !

  1

  

  Eugenia•950

  @JaneMorozPosted almost 2 years ago

  @Swing95 Well, if you want to position image absolutely, I guess you can put profile-picture inside top-background and add position: relative; to top-background(otherwise image'll be positioned relative to body). Then just use top, left, transform:translate to position profile-picture properly.

  0