Profile card component. HTML and CSS

Hi Sir

Congrats on finishing this project 🎊

I have a suggestion: Convert the attribution div to attribution footer

Do you understand ?

@MladenLm Codes looking good! One thing you forgot was the background. You can set the background like they have in the example using the background attribute on the body. If you need any help with this just let me know.

As for getting the signature to the bottom it might not be the perfect solution, but I simply changed your body to display: grid; with the following properties align-items: center; justify-items: center; grid-template-rows: 98% 2%;

I don't know if you have used grid before or not, but they can be really useful when you want something a little more structured than flex allows. If you haven't used grid before and would like an explanation of what the above code does just let me know!

As for this "I made main into display: flex, and flex-direction: column, yet if I space-between they are not centered and all the way to the bottom." the reason that didn't work is because main isn't a parent element of <div class="attribution"> but rather this element is a child of the body element. However you can't just change the code to justify-content: space-between; as that would push the profile card to the top of the page and the attribution to the bottom. This is why I changed it to grid and did it that way.

Here's a link to a page I made showing what your code would look like with the changes I mentioned. changes

Hope this all makes sense and helps!