four-card-feature

Community feedback

• 

  Szymon Rojek•4,540

  @SzymonRojekPosted almost 4 years ago

  Hi Atharva,

  Well done! :D

  I have checked your HTML structure, a few tips from me below:

  • instead of div class="cards" you can add this class to the one section tag in my opinion;
  • you don't need here four sections and the tag figure;
  • don't style on tags, this is not a good practice, that's a reason why we have got classes. I'd recommend to learn BEM naming convention and generally create readable descriptive classes;
  • try to don't set explicit width to the container and explicit height of the card: 250px (this height doesn't have to be here => it is better to use min-height or max-width).

  It is essential to understand well the height and width vs min-height/max-height & min-width/max-width but don't worry. It is quite a difficult subject. You shouldn’t need to give items height unless they have a background or absolutely-positioned or floated elements within them that would not normally be accounted for in the height of an element. Experienced developers use min-height and min/max-width more than anything else. It allows elements to grow and shrink.

  • check your project in your browser by the inspector => between 770px and 1020. The component is very tight (no gaps between). What do you think about tablets? For example, you start from one column, then create two rows with two boxes each and finally get the desktop design pattern
  • the scroll is not needed on desktop size.

  Greetings :D

  2

  ---

  

  Atharva Shandilya•160

  @Atharva-ShandilyaPosted almost 4 years ago

  Thanks for your feedback!

  0