Submitted about 3 years ago

Profile Card Component Solution Using HTML and CSS

Samia Mahwash•170

@Mahwash-Aly

Preview site View code

This is a solution for...Profile card component

HTML
CSS

1newbie

Design comparison

SolutionDesign

Solution retrospective

This is my second challenge. I am looking forward to your feedback. I had problem with positioning two background pictures together. Though, I was successful in getting the desired outcome but I quite didn't understand the concept. I adjusted the values until I was thought it was perfectly positioned. Also, I couldn't push the footer to the bottom. It kept on appearing on the side of the container. I had to delete it in order to get the desired outcome. Any thoughts about how to do that. I checked stack-overflow, but it wasn't much help.

Community feedback

Account deleted
Hi,

Your solution looks good, you managed to have everything in place, but...;

The container is not centered, both vertically and horizontally.

Remove the margin-top and margin-left that you have on .container, you do not need it. To center it properly add height: 100vh on the body it'll be dead on the center.

And the way you positioned the background images seem to be ok to me.

You should also have a main tag on your html document... you should check the report.

Keep coding👍.
1
Samia Mahwash•170
@Mahwash-AlyPosted about 3 years ago
@thulanigamtee Thank You. I will make changes as you suggested.
0
Samia Mahwash•170
@Mahwash-AlyPosted about 3 years ago
@thulanigamtee I did as you suggested and problem got resolved. Thanks!
0
Account deleted
@SamiaMahwash Glad not know that my comment was helpful.
0

Please log in to post a comment

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