@vanzasetia
Posted
Hi, Luyanda! 👋
Great work on this challenge! Your solution looks pretty good! 😀
Regarding flexbox,
- First, no matter how much width the child element has, as long as the parent element has
display: flex;
andjustify-content: center;
, then the child element would be centered horizontally. - Second, the current HTML markup is a little more complex than it should. You can simplify it by making the
body
element as the flex container and making themain
element as the card element instead. - Third, there's no need for
margin
to center the card. I would recommend addingpadding
to thebody
element to prevent the card from having full width and full height on mobile view. - Lastly, the only thing that the card is needed is a
max-width
with arem
unit. Currently, the card looks so big on some breakpoints like on900px
,>1440px
, etc.
That's it! I hope this information is useful! 😁