Responsive product preview using CSS and HTML

Community feedback

• 

  yas•390

  @yosrajalaliPosted over 1 year ago

  Hi Bassem 👋. Congratulations on successfully completing the challenge!🎉

  just a couple of suggestions

  HTML

  • for your whole container it's better to use <main> tag instead of a <div>.main tag is an HTML5 tag which is supposed to represent the main content of website. it's better for SEO purposes. you can check this 👉MDN

  CSS

  • if you want to center the whole content of your page horizontally and vertically using display flex for body is the best choice, like the code below..

  body {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  }
  

  • (*) is a universal selector and it is used to give universal styles to all elements. if you use font-weight and background-color in this universal selector it means that it gets apply to all elements of the page. try to do this..

  body {
  font-weight: 300;
  background-color: rgb(227, 224, 224);
  }
  

  Anyway your solution is great🙂

  I hope you find it useful😊

  Marked as helpful

  1

  ---

  

  Bassem Negm•30

  @BassemNegmPosted over 1 year ago

  @yosrajalali Thank you so much for your feedback, and I love how simple you explained it. I'll definitely use what you suggested in my upcoming codes.

  1

  

  yas•390

  @yosrajalaliPosted over 1 year ago

  I’m glad to hear that..

  good luck🌹 @BassemNegm

  0