Profile card component using flexbox

Community feedback

• Account deleted

  The reason the site is extending is because of the bottom background circle. You can see it if you inspect the page with right click and inspect. Remove the background circles from HTML and use the background-image property on the body element in CSS in combination with background-repeat: no-repeat and background-position set in vw and vh.

  There will still be a bit of extra space though and the scrollbar will appear because by default the body has a small margin. To remove default margins and paddings from everything use the following code at the beginning of CSS:

  
  *, *::before, *::after {
      padding: 0;
      margin: 0;
  }
  
  

  For stats it would be better to use a <ul> and make each stat a <li>. You should also make the card an <article> or a <section> and try to make it responsive so it changes the size depending on the viewport. Take a look at my solution if you have trouble with anything.

  Marked as helpful

  1