Blog preview card main | HTML & CSS Responsive

Solution retrospective
I've begun to understand the concepts of CSS, and I think it's time to begin with a challenge with JavaScript
What challenges did you encounter, and how did you overcome them?No challenge
What specific areas of your project would you like help with?If you have any comments to help improve the code, just let me know
Please log in to post a comment
Log in with GitHubCommunity feedback
- @GabrielNoss
Thanks again. I already made the changes that you suggested
- @FunTomDev
It is not a great practice to put some weird styles on your <body> tag. As I see you have set your body to be margin: auto on both left and right but normally <body> element (as an element that SHOULD contain your whole page) should have default or maximum screen size. Instead you should've set your <main> element to be centered and do it not by using margin-left:auto & margin-right: auto, but instead by using absolute position with transform: translate or by setting display flex on parent element (<body> in your case which is still not a good solution - should have other parent element). If you choose to set display:flex on your element, you should do it on your <main> tag, which should (as <body>) have width and hight set to 100% and then your div.card will be the element that is being adjusted to the center of the page.
Join 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