Product preview card component solution with Bootstrap 5

Community feedback

• 

  Harsh Kumar•1,390

  @thisisharsh7Posted about 2 years ago

  Hey Fiqih Alfito, well done! your solution looks good!

  In order to answer your query, the product image can be managed by inserting the tag <picture> to wrap both desktop and mobile images in the same tag, and render each image differently depending on the device using the width you'll insert in the HTML! Also, you can use maximum-width and maximum-height properties to ensure the image fits and isn't cropped.

  Hope this helps.. Happy coding🙌

  Marked as helpful

  1
• 

  Fiqih Alfito•320

  @fiqihalfitoPosted about 2 years ago

  aah I forgot about <picture> tag. Thank you so much for the solution. I'll be careful to place an image.

  Have a nice day!

  1