Ennry

Latest comments

• 

  mariem khaled•250

  @mariemkhaled0

  Submitted over 2 years ago

  

  responsive page

  1

  20
  

  Ennry•40

  @Ennry

  Posted over 2 years ago

  Hello and Great job in completing the challenge!

  I have a few suggestions to make your code better:

  To make the grid work better you can set a div to display: grid; with 3 divs inside. Each div should have their own content inside. You can set the grid-template-columns: 1fr 1fr; or repeat(2, 1fr); to have a grid with 2 column option and change each div grid-column and grid-row.

  To make the grid responsive on mobile you can set for example @media (max-width: 425px) and change the grid-columns-template: 1fr means one column for mobile and change each div grid-column and grid-row for the mobile width.

  You can set your grid to the center of the viewport while setting the body min-height: 100vh and display: flex; with justify-content: center align-items: center; You can look at my solution for examples.

  You did a great job for a beginner, keep at it! Happy coding!

  0