product card

Community feedback

• 

  Hassia Issah•50,670

  @HassiaiPosted almost 2 years ago

  add the alt attribute alt=" " to the img tag <img> to fix the error issue. the value for the alt is the description of the image. replace <h3> with <p> to fix the accessibility issue.

  To center .main-section on the page using grid, there is no need to add justify content: center because you already have place-items: center. in grid justify-content goes with align-content to center a child in a parent.

  Give .container_text a background-color of white and a padding value for all the sides, there no need for a margin-left value.

  There is no need to give .main-section, a gap value, two grid-template columns, a padding value and text-align center. Give .main-section 1 grid-template-columns with a value of 1fr 1fr and display: grid.

  In the media query, give .main-section a max-width value, a grid-template-column of 1fr and grid-template-row of 1fr 1fr.

  Use relative units like rem and em as unit for the font-size, padding, margin, width and height values. For more on CSS units click here

  Hope am helpful.

  Well done for completing this challenge. HAPPY CODING

  0