Responsive page using Grid

Community feedback

• 

  Hassia Issah•50,650

  @HassiaiPosted over 1 year ago

  the html must have <h1> to fix the accessibility issues. Every html must have <h1> to make it accessible. Always begin the heading of the html with <h1> tag wrap the sub-heading of <h1> in <h2> tag, wrap the sub-heading of <h2> in <h3> this continues until <h6>, never skip a level of a heading.

  Give the body a background-color.

  To center .estura on the page using flexbox or grid instead of margin, add min-height:100vh; display: flex; align-items: center: justify-content: center; or min-height:100vh; display: grid place-items: center to the body.

  USING FLEXBOX:
  body{
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  }
  

  USING GRID:
  body{
  min-height: 100vh;
  display: grid;
  place-items: center;
  }
  

  Use relative units like rem or em as unit for the padding, margin, width values and preferably rem for the font-size values, instead of using px which is an absolute unit. For more on CSS units Click here

  Hope am helpful.

  Well done for completing this challenge. HAPPY CODING

  Marked as helpful

  0
• 

  Finney•3,030

  @Finney06Posted over 1 year ago

  Hello there 👋. Good job on completing the challenge !

  Here is a suggestion regarding your code that may be of interest to you.

  HTML 🏷️:

  To clear the Accessibility report:

  • Starting with <h1> and working your way down the heading levels (<h2>, <h3>, etc.) helps ensure that your document has a clear and consistent hierarchy.

  I hope you find it helpful!😏 Above all, the solution you submitted is 👌. 🎉Happy coding!

  Marked as helpful

  0