Skip to content
Submitted over 2 years ago

challenge 6 Stats preview card component

isaac nabil•220
@nabil4416
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Stats preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

it is possible to use the grid property to do this challenge, for me I chose to go with the flexbox, the difficulty I faced was the overly background for the proposed photo, hope that some one see the code and give his opinion, whatever your comments, be sure that they will help me to improve my skills

Community feedback

  • Ahmed Bayoumi•6,740
    @Bayoumi-devPosted over 2 years ago

    Hey! It looks good!...

    I suggest you put the status of the preview card component into the list item to add more semantics to your project, Div's don't do much for semantics but a list is much more meaningful..:

    <ul class="stats-preview__stats">
   <li>
      <span class="stat-number">10K+</span>
      <span class="stat-name">Companies</span>
   </li>
   <li>
      <span class="stat-number">314</span>
      <span class="stat-name">Templates</span>
   </li>
   <li>
      <span class="stat-number">12M+</span>
      <span class="stat-name">Queries</span>
   </li>
</ul>

    I hope this is useful to you... Keep coding👍

    Marked as helpful
    0
    isaac nabil•220
    @nabil4416Posted over 2 years ago

    @Bayoumi-dev thank you very much Mr Ahmed, it's a good solution, I didn't think of that, it's more practical and easier

    0

Please log in to post a comment

Log in with GitHub

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord