With mobile 1st triple div and using display: table-cell for desktop

Community feedback

• 

  Vanza Setia•27,715

  @vanzasetia

  Posted over 3 years ago

  Hello, Kimue! 👋

  I would recommend focusing on the quality of your code instead of how fast I could finish this challenge. Speed will come in nature but you need to put some effort to make the code has good quality.

  I have a recommendation on making the cards perfectly centered on the page. So, my recommendation is to make the body element as the flex container and add min-height: 100vh to it so that it allows to grow if needed. Also, add some padding to prevent the card from touching the browser edges or simply having full width and height on small screen sizes.

  I highly recommend not setting any styling on the html element because I would like to think of the html element like a table and the body element as a piece of paper so I don't want to change the way the table of the paper, instead it's recommended to adjust the element inside the body element instead. So, the point is I recommend removing the max-width and overflow properties on the html element to prevent any issues.

  I suggest making the "Learn More" buttons as link elements instead of button elements. As a user, I would expect after I click one of those buttons, I would get navigated to another page. That's what I would expect. Now, what do you think is going to happen after the user clicks the "Learn More" button?

  That's it! Happy coding! 😁

  12