Product preview card component

Community feedback

• 

  Okkie14•330

  @Okkie14Posted over 1 year ago

  @Abanoub-Ashraf1 You did an amazing job here, looking through your code I saw a few things that were pointed out to me as well

  1. Don't use a h6 tag before an h2 tag(I made the same mistake here), in the css just style the different tag to get them bigger or smaller.
  2. On font sizes px are fixed, making your website more responsive I would recommend rem, you can read more on rem here: https://developer.mozilla.org/en-US/docs/Web/CSS/rem
  3. Just have a look the mobile img is different to the desktop img using the <picture> element can solve this read here to see how to use it: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/picture
  4. Lastly your media query isn't stacking the content but rather keeping the box. I would recommend having a look at that, on tablet devices (not part of the assignment I know) it gives side scrolling just something to look at as an additional challenge.

  Hope this helps :-)

  1

  ---

  

  Abanoub Ashraf Fawzy•40

  @Abanoub-Ashraf1Posted over 1 year ago

  @Okkie14 Thanks a lot for your advice!

  0