Result Summary component

Community feedback

• 

  Benjamin Semah•70

  @BenjaminSemahPosted 12 months ago

  Hi Mbungai. Great job done! 👍

  HTML: For your HTML, I will encourage you to consider using semantic HTML elements. Divs are useful, but for the sake of accessibility, SEO, and improving code readability, using these semantic elements like main, section, footer, button, ul and li (for list items) is highly recommended.

  CSS: Your CSS looks good! The only feedback I will give is on where you use blocks:nth-child. For example, you do this for all 4 blocks.

  .blocks:nth-child(1) {
    background-color: #FFF6F5;
  }
  .blocks:nth-child(1) {
    color: hsl(0, 100%, 67%)
  }
  

  Since it’s targeting the same element. You can do the following instead. This does the same thing and it’s more concise. And same for the other three .block elements too.

  .blocks:nth-child(1) {
    background-color: #FFF6F5;
    color: hsl(0, 100%, 67%);
  }
  

  Cheers and happy coding!

  Marked as helpful

  0

  ---

  

  Forche Francesco•280

  @Mbungai-FrancescoPosted 12 months ago

  Thanks for the proposals Sir, I'll do more research on semantic HTML elements and look at integrating them in my coding journey @BenjaminSemah

  0
• 

  Bryan Li•3,530

  @Zy8712Posted 12 months ago

  Your site looks pretty good. Not really too sure what you mean by "those little lines". I'm assuming you are refering to the box shadow of the container. In that case you can use the box-shadow css property to assign it to your div containing everything. You can read more about it here.

  Aside from that the only other thing I think could add is <main> tags to wrap around your content. This is different from your <div class="main">.

  Hope this feedback is useful to you

  0

  ---

  

  Forche Francesco•280

  @Mbungai-FrancescoPosted 12 months ago

  @Zy8712 If you zoom on the edges of the reaction tab or the memory tab and the 2 others, you'll notice some little lines on the four corners. That's what am talking about. " On the challenge it self, not on my solution"

  0