Responsive single-price-grid using grid flex box and list

Community feedback

• 

  _nehal💎•6,710

  @NehalSahu8055Posted over 1 year ago

  Hello Coder 👋.

  You design seems good ✅

  Some suggestions for improving your code:

  In HTML :

  • The page must contain at least one h1 element identifying and describing the main content of the page.

  • An h1 heading provides an important navigation point for users of assistive technologies, allowing them to easily find the main content of the page.

  • Usually the best practice is to start the main content of a web page with a level 1 heading (h1), with no other headings before this high-level heading.

  • Mark the sub-sections of the page as level 2 headings (h2). If the level 2 sections contain sub-sections, mark these children as level 3 sections (h3) and so on. So fix them Ex :

  <h1> </h1>
  <h2> </h2>
  <h3> </h3>
  

  Note : we use the headings line by line in order way

  IN CSS :

  Your Code component is not center aligning it shows top of the web page so fix that

  1) Approach Using grid

  body {
           display:grid;
           place-items:center;
           margin:0;
           height:100vh;
  }
  

  2) Approach Using flex

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

  I Hope it helps.

  Happy Coding 😊

  Marked as helpful

  0

  ---

  

  Majd Allaham•120

  @Vat123Posted over 1 year ago

  @NehalSahu8055 ty for the advice of the h1,h2,..etc for making the page in the centre i didn't want that,i will fix it , but thank you anyway

  0