Stats preview card component challenge - HTML/SCSS

Community feedback

• 

  Raymart Pamplona•16,100

  @pikapikamartPosted about 3 years ago

  Hey, great work on this one. Layout in desktop looks great, the responsiveness could be better since when it changes to mobile layout, the content occupies almost the whole screen's width. Though at mobile layout it looks fine.

  Some suggestions would be:

  • Avoid using height: 100vh on a large container especially the body tag. This makes the element's height limited to the viewport/screen's height. Instead use min-height: 100vh on it, this takes full height but allows the element to expand if needed.
  • For the 3 information on the bottom left side of the content, since those are "list" of information about the company website, you can use ul on it.
  • The words "10K+" and other highlighted on that section is not really a heading tag, using heading on it does not convey anything to the user about the section. Use a regular p tag on it.
  • Also, when using heading tag, make sure to not skip a level. If you use h4 make sure that h1, h2, h3 are all present before it.
  • Lastly, I see that you are using bootstrap on this one. I suggest not using framework to tackle it especially when you are starting out. Just use css or scss to tackle websites for now until you understand different styling properties.

  Aside from those, great work again on this one.

  Marked as helpful

  0