@Dreamleaf
Posted
Generally very good, but you have some problems with the card width changing on different viewport sizes.
For example, the image could be placed without a wrapper element to fix that section - or you could add display: contents;
to the .header__bg class.
The html could also be simplified by reducing the number of wrapper divs you are using, I approach these types of layouts with the following structure:
main.card
You can center everything using flex or grid on the body, and add a standard padding to the .card. This way you may just need to tinker with specific sizings in a media query if needed.
Hope this is helpful! And have a great christmas!
Marked as helpful