Please give a feedback

Community feedback

• 

  Vanza Setia•27,775

  @vanzasetiaPosted about 3 years ago

  👋Hi Ted Dino!

  I have some feedback on this solution:

  • For the background pattern, I recommend to use CSS background-image on body element, instead of using img tag. You can see ApplePieGiraffe solution for the background-positon, if you're struggling to position the backgrounds.
  • You should never wrap text only with meaningless tag like span. It's bad for accessibility.
  • The stats should be a ul and wrap each item with li.
  • The stats number shouldn't never be a heading tag. If you think it is an important element, try to use strong tag instead.
  • You need to do this to make all elements box-sizing: border-box

  * {
    box-sizing: border-box;
  }
  
  /* OR */
  html {
    box-sizing: border-box;
  }
  
  * {
    box-sizing: inherit;
  }
  

  • Try to use flexbox to make the card on the center of the page. It's much simpler than using absolute positioning method.
  • Use rem or sometimes em instead of px unit. Using px will prevent the user to control the size of your page based on their needs.

  That's it! Hopefully this is helpful!

  Marked as helpful

  1

  ---

  

  Ted Dino•170

  @ted-dinoPosted about 3 years ago

  Hi @vanzasetia, thank you for taking your time reviewing my code. First, its true that I had trouble figuring out how to do the background and I want to thank you for suggesting a solution for that, I will definitely repeat this challenge. Second, about the stats I didn't know what to do there so I just make a way how display it like in the image. silly

  Your comment really helps me understand more about CSS. I think I know much more CSS than yesterday because of you. I will stick this in my mind. Thank you so much.

  0

  

  Mohamed-G•205

  @UnderdogScripterPosted about 3 years ago

  @vanzasetia Got any idea on how did ApplePieGiraffe position the background images so precisely?

  0

  

  Vanza Setia•27,775

  @vanzasetiaPosted about 3 years ago

  @UnderdogScripter He's just playing around with the calc until it got the result that he wanted. See the solution page and scroll down to Arturo Simon and see what ApplePieGiraffe had replied.

  0

  

  Mohamed-G•205

  @UnderdogScripterPosted about 3 years ago

  @vanzasetia Thanks!

  0