A profile card with HTML, CSS

Hi Gregorio, Great effort! I'd suggest the following with your HTML structure. Please don't use <div> tag everywhere; it's usually bad practice, considering that there are semantic tags like: <main>, <section>, <article>` etc.

The <div> should primarily be used for decorative purposes. Secondly, for the stats part of the HTML structure; try the following:

<ul>
   <li>
      80K 
      <span>Followers</span>
   </li>
</ul>

Then applying the necessary CSS styles.

Also don't try and hard code line breaks into your HTML by using <br> tags, if you want to create space between various elements: use the margin and padding CSS properties.

Lastly considering your question, you can add the bg-pattern-top.svg and bg-pattern-top.svg to the .content class as <img> and then postion them, as follows:

 .content {
   position: relative;
}

.bg-pattern-top {
   position: absolute;
   top: 0;
   left: 0;
}

.bg-pattern-bottom {
   position: absolute;
   bottom: 0;
   right: 0;
}

NB: Please note that I just named the classes for the pattern as .bg-pattern-top and .bg-pattern-bottom respectively.

The above can be one approach using only CSS.

Best of luck with your coding journey!!!