Product-Preview-Card-Component

Community feedback

• 

  Ayush Patel•200

  @codesbyayushPosted over 1 year ago

  Hey I have made the changes you asked question for in your repo and created a merge request. There would be a request with my name on your github repo. Checkout the changes and let me know if you have any questions on how it works.

  I have made the body a grid layout to center the div in it.

  I have changed the file location in src attribute to show images and explained the reason in my pull request.

  Marked as helpful

  1

  ---

  

  Udbhav Dalmia•150

  @UdbhavDalmiaPosted over 1 year ago

  @codesbyayush thank you for helping and changing the code. I had one last question about how to make the site responsive I mean if I open it on a mobile phone it would suck so could you tell me a bit about that, could you brief me on the changes you made, please.

  0

  

  Ayush Patel•200

  @codesbyayushPosted over 1 year ago

  @UdbhavDalmia I made body a grid layout in earlier changes as grid have inbuilt style property to center items in it and I used it to center the card.

  For travelling in folders we use slash so your img path earlier was "images/image-product-desktop.jpg" which says that go inside the images folder and find the file with the name after slash but there was no such folder in the directory so the images were not showing up and by removing "images/" we changed path to look in the current folder.

  For making design responsive you can use media queries and you also have to change the main image to mobile version so for that you can use <picture> tag.

  Marked as helpful

  0

  

  Udbhav Dalmia•150

  @UdbhavDalmiaPosted over 1 year ago

  @codesbyayush Thank you so much for your explanation and for clearing up my queries.

  0
• 

  Fer•3,970

  @fernandolapazPosted over 1 year ago

  Hi 👋,

  🔹The images are not showing because you are using the wrong path. For some reason the image files are not in their original folders and therefore, as you have it, the correct path would be "image-product-desktop.jpg" instead of "images/image-product-desktop.jpg".

  Please let me know if it helped you.

  Regards

  Marked as helpful

  1

  ---

  

  Udbhav Dalmia•150

  @UdbhavDalmiaPosted over 1 year ago

  @fernandolapaz Hi and thank you so much for helping.

  0