Profile Card Component

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  👾Hello Asif, congratulations for your new solution!

  Your solution is great but I've a better idea for the background-image circles:

  You can add these two circles as a background, adding it to the body with two keys properties, background-image and background-position, note that the comma inside each properties declare the single modification for each circle separated.

  To align the two circle as background-image

  background-image: url(../images/bg-pattern-top.svg), url(../images/bg-pattern-bottom.svg);
      background-repeat: no-repeat, no-repeat;
      background-position: top -500px left -400px, bottom -700px right -250px;
      background-color: hsl(185, 75%, 39%);
  

  Use this for the alignment:

  body {
      min-height: 100vh;
      text-align: center;
      display: flex;
      justify-content: center;
      align-items: center;
  }
  

  👋 I hope this helps you and happy coding!

  0