Product-Preview-Card-Component

Community feedback

• 

  hitmorecode•6,680

  @hitmorecodePosted over 1 year ago

  Nice well done. Just a few tips

  • To switch pictures between desktop and mobile, try to use the picture element. This way you don't have to hide one and show it with css.
  • As for the headers switch the h1 and h3. h1 should always be the title of the page / name of the product etc...
  • On price span you should use flexbox to align current and old price.

  <picture>
  <source media="(min-width: ...px)" srcset="image for desktop">
  <source media="(min-width: ...px)" srcset="image for mobile">
  <img src="./images\image-product-desktop.jpg" alt="perfume-bottle" class="main-image">
  </picture>
  

  Marked as helpful

  1

  ---

  

  fat-hia•70

  @fat-hiaPosted over 1 year ago

  I like the tip about using pictures as I relied on hiding and displaying images in my solution, I'll give it a try ASAP! Thanks :) @hitmorecode

  0
• 

  KingPhred•50

  @KingPhredPosted over 1 year ago

  Hello Durga, I have just gone through your code and I all I can say is that the length of code written is alright.

  Keep it up👍

  Best Regards

  1