Design comparison
Community feedback
- @drjrodriguezPosted over 1 year ago
It looks like your 110 px padding is interfering with the centering, at least visually. I see the problem when you turn off the padding. And probably your monitor is very wide, so you may not have seen how it can offset your card to the right.
When dealing with the sizing and alignment, I made both the gray background a flex box, as well as the card itself. Then I set size of the gray background box to some % of the screen size, but justified its content to the center. Then within the card, I did the same.
Also, I noticed that when you make the screen width smaller, the card got very narrow and stretched out the text as it wrapped more closely. I think you need a min-width to prevent that.
Marked as helpful1
Please log in to post a comment
Log in with GitHubJoin 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