I found myself having to redo the style.css file, as I was simply reacting to how my card component looked at the time. For example, if I found my "card-footer" div was not aligned with the rest of the card, I would manually add margin until it aligned.
Then I realized once I changed my screen size, that the alignment would be all off yet again. I decided to upload my solution anyway so I could unlock the ability to view other solutions and seek inspiration on how they are able to align their content easily.
I am curious to find out what the best practice is for aligning content. For this project, I used flexbox and set my flex-direction to column, which helped quite a lot but I struggled slightly with some components, such as aligning the image to the center of the card.
Overall, this was a good challenge and I'm hoping that by learning from my peers, I will be able to style future challenges with less issues. On to the next challenge!
@MachadoA
Posted
Hello, congratulations on the project! However, I suggest that:
Remember that after submission, you have the opportunity to see how others approached the same project. Take the chance to review and clarify any doubts you may have.
See you soon!
Marked as helpful
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
