Submitted almost 3 years ago

Profile Card Component / Only Html & Css

@thebennyma

A solution to the Profile card component challenge

Solution retrospective

I had some time without programming so it was difficult to remember the first few minutes but with a little review I managed to solve this little challenge just using html and css. I am happy to complete this challenge!

Code

Please log in to post a comment

Community feedback

Lucas 👾•104,160
@correlucas
Posted almost 3 years ago
👾Hello Marco Antonio, congratulations for your new solution!

Your solution is great, but you need to fix the background that's displaying only one circle.

Remember that you can addd these two circles as a background, insert it to the body with two keys properties, background-image and background-position, note that the comma inside each property and declare the single modification for each circle separated.

Here's is your code with the circles applied and working:
```
body {
    font-family: 'Kumbh Sans', sans-serif;
    background-color: hsl(185, 75%, 39%);
    /* background-image: url(images/bg-pattern-top.svg); */
    background-color: hsl(185deg, 75%, 39%);
    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-repeat: no-repeat;
}
```
👋 I hope this helps you and happy coding!
Marked as helpful

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord