Responsive stats preview card HTML5 CSS3 mobile-first

Community feedback

• 

  Aaron•110

  @ag7621Posted almost 2 years ago

  Hello!

  Although I'm a bit new myself to development I hope I can help with some tips I've learned myself.

  Handling the container border-radius, I made sure I applied the same to the image container, the container and then when I swicthed to desktop, I had to remove and add some.

  What I find easiest when handling border radius is using the border-radius property on the card container so that it applies it to every corner without having to declare each corner individually. When it comes to images corners that stick outside the container, you can also apply overflow: hidden; which will in turn hide the bits flowing outside the container.

  How to organize CSS file content, in order of appeareance? an entire element and its child first?

  When it comes to CSS I like to declare variables at the top in the :root so that I keep most of the commonly used ones in one place such as color, font-size, etc. After that I like to declare most of the general styling I can in the body so it cascades down into the rest of the content which helps with not having to declare styling to every component.

  Hope that helps! Happy coding!

  -Aaron

  0