Metrics Card with Image - Html & Sass

Community feedback

• 

  Raymart Pamplona•16,100

  @pikapikamartPosted about 3 years ago

  Hey, awesome work on this one. Layout seems great on desktop layout however there is no mobile state which shouldn't be the case.

  It is fine that you time your project creation, but it is more important to make sure to deliver a responsive website than being fast.

  Some other suggestions would be:

  • Do not set a height on the body tag, as this limits the element's height based on the viewport/screen's remaining height. Use min-height: 100vh to take full height and this allows the element to expand if needed.
  • Instead of using margin: 0 auto on the main element, since you are using display: flex on the body tag, use justify-content: center and flex-direction: column this way, you won't need that margin and you could let now the .attribution to be in the flow, meaning you could now remove the position: absolute.
  • The .countersBox could have used ul element, since the content inside it are "list" of information about the company website.
  • The text inside the .counter should not use a heading tag, using heading tag on the 10k+ does not make sense at all since it doesn't defined anything in the section. If a design has bold text, it doesn't always mean that it is a heading tag.
  • Also, wrap the text below each highlighted text on the bottom part with p tag, do not just use span, make sure to wrap text content inside a meaningful element.
  • header is not needed on the main especially if you are using it just for background-image holder, you can just use div on that one.
  • There is an extra not used selector which is the .overlay

  Aside from those, great work. But make sure to always have the mobile breakpoint:>

  0

  ---

  

  bunee•2,020

  @buneeIsSloPosted about 3 years ago

  Hey! @pikamart, I really admire your solutions... If you don't mind, could you please give me some feedback on my latest solution? Click here

  0

  

  Raymart Pamplona•16,100

  @pikapikamartPosted about 3 years ago

  @buneeIsSlo :>>

  Sure i'll give it a review, but maybe not this time in the morning since I am going to design some things, but after lunch on my time, I will first going to view your solution^^

  1

  

  bunee•2,020

  @buneeIsSloPosted about 3 years ago

  @pikamart I'm totally fine with that. Please take your time.

  0