four card features

Community feedback

• 

  haquanq ®️•1,585

  @haquanqPosted 4 months ago

  Hello @arun81302 👋👋👋

  Congrats on completing the challenge!!

  Here is my feedback to improve your solution:

  • Don't skip heading level because it will mess up you page flow, you should increase the heading level based on the depth of your content (is this sub content belong to this content/heading). Also, heading size has nothing to do when choosing correct heading level, you choose it because it makes sense for you page flow.
  • Using more semantic elements, you are overusing div while there are many semantic HTML markups out there. For example, you can wrap each card with article and inside it just h2/3/4 p img and as you can see that each card has repetitive content structure, you can use ul 'li' to indicate that this is a list of article.
  • About responsive, lets start with using viewport width as such:

  /* 
      min-width is when your screen size getting bigger
      max-width is when your screen size getting smaller
  */
  @media screen and (min-width: px/em/rem | max-width: px/em/rem) {
      /*
      when using min-width: x ~ apply style when my screen size at minimum width of x
      when using max-width: x ~ apply style when my screen size at maximum width of x
      */
  }
  
  

  For more reference, you can checkout my solution for this challenge.

  Hope this is helpful to you 🙏

  0
• 

  P

  Mohd Sadaf•770

  @MsadafKPosted 4 months ago

  .

  0