Responsive Product Card

Community feedback

• 

  Aurélie•70

  @aureliemesbahiPosted about 2 years ago

  Hello.

  Your solution isn't responsive. You should use relatives length and media queries.

  You can help you with this link:

  https://www.w3schools.com/css/css_rwd_mediaqueries.asp

  https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Values_and_units#:~:text=Relative%20length%20units&text=Font%20size%20of%20the%20parent,of%20other%20properties%20like%20width%20.&text=x%2Dheight%20of%20the%20element's%20font.&text=The%20advance%20measure%20(width)%20of,0%22%20of%20the%20element's%20font.&text=Font%20size%20of%20the%20root%20element.

  Marked as helpful

  0

  ---

  

  Harsh Mohite•100

  @harsh-mohite-09Posted about 2 years ago

  @aureliemesbahi Thank you for the feedback. I have added a media query at max-width: 375px. When width is less than 375px. The flex direction changes to column and also a few font sizes get reduced.

  0

  

  Aurélie•70

  @aureliemesbahiPosted about 2 years ago

  @harsh-mohite-09 yes like this it would be perfect. you're welcome

  happy coding

  0
• 

  Andrei•110

  @retiens123Posted about 2 years ago

  Use min-height: 100vh to the body , to let body grows taller if the content exit from the visible page

  Consider using first time when you start to code:

  • {padding: 0; margin: 0; box-sizing: border-box;}

  I hope it's helful for you and continue to improve that skill!

  Marked as helpful

  0

  ---

  

  Harsh Mohite•100

  @harsh-mohite-09Posted about 2 years ago

  @retiens123 Thank you for the feedback.

  0