Profile card with CSS flex box and mobile first approach

Community feedback

• 

  Edufelibugm•450

  @edufelibugmPosted about 2 years ago

  Hi @pippal5536 !!! 😄

  I can't help you with the background but about at center a image between two divs, i recommend you use the atribute position: relative and add attributes how top: ;, bottom: ;, left: ; and right: ; to center the image. ✍

  other solution is the use of atribute position: absolute; 🤖

  Have a great day and happy coding 🤖

  Marked as helpful

  1
• 

  muhamad•360

  @noheezybucketPosted about 2 years ago

  Hi ,

  Your HTML code is clean. Seems like you project is looking great on all screen sizes:), but I think you can put some side margin at 320px, there's no space between the body and the borders of the card.

  I hope that you will find the answer of your questions right here :

  a- https://www.w3schools.com/css/css_background.asp

  b- to center the avatar between two divs you can try this in your css:

  .avatar img { position: absolute; top: 50%; transform: translateY(-50%); }

  .avatar { position: relative; }

  Keep coding man.

  Marked as helpful

  1