Stats Preview Card Component using HTML and CSS (w/ Flexbox)

Community feedback

• 

  Yazdun•1,310

  @YazdunPosted about 3 years ago

  Hello Risclover and this looks great ! Here I have some suggestions:

  • Approach mobile first, It will make your life much easier

  • for stats, I think you'll be better off with something like :

  <ul>
        <li>10k+<span>companies</span></li>
        <li>314 <span>templates</span></li>
        <li>12m+ <span>queries</span></li>
  </ul>
  

  In this case ul is more efficient IMO.

  Overall great job and keep it up 👏

  0

  ---

  

  Sara Dunlop•450

  @RiscloverPosted about 3 years ago

  @Yazdun Hi Yazdun, I appreciate the feedback and suggestions!

  It's funny that you mention your first tip... I've seen people suggest that several times now - to do "Mobile first because it's easier" - and actually after I'd created my "Desktop mode", I remembered that advice. That's why, in my code, you'll see that I pretty much recreated my whole CSS in the "Mobile mode" @media block. It's because I was having a bit of trouble and was trying to think of it in the sense of starting from mobile. I mean I'd already finished my desktop version, so I wasn't going to start over, but when I started to think about it from a fresh point of view (rather than from the point of view of working from desktop to mobile), it was a lot easier. :)

  Is the unordered list necessary? I never would have thought of that. When I look at the page, I see it as three separate div boxes of text, not a list. I understand using a list for horizontal navbars and such, but why this?

  Thanks! <3

  0

  

  Yazdun•1,310

  @YazdunPosted about 3 years ago

  @Risclover No worries ❤ ! It's not necessary, personally I find it easier to use ul in such cases, but you can take whatever approach that suits you better

  0