4 Cards Feature - CSS Grid

Community feedback

• 

  T

  ApplePieGiraffe•30,545

  @ApplePieGiraffePosted over 2 years ago

  Hi there, Pon Huang! 👋

  Great work on this challenge! 👍 Your solution looks good and is responsive! 😀

  A few suggestions I have are,

  • Using a single heading tag for heading in this challenge, since it is really a single heading (not two separate headings). You can style each part of the heading differently by wrapping one of them in a span tag.
  • Adding width: 100% to the feature cards and then adding a max-width to them instead of setting an explicit width on them. That way, they will shrink when the size of their container becomes smaller (e.g., like when the size of the screen changes), and you won't have to use media queries to adjust their width all of the time. 😉
  • Perhaps using article tags for the feature cards (since they already contain a heading and a description) to make your HTML a little bit more semantic!

  Hope you find these suggestions helpful. 😊

  Keep coding (and happy coding, too)! 😁e

  Marked as helpful

  3

  ---

  

  Pon Huang•210

  @ponhuangPosted over 2 years ago

  @ApplePieGiraffe

  Hello ApplePieGiraffe :)

  Thank you so much, this is super helpful. Really appreciate letting me know more about the semantic and more efficient way to set the responsive design. 🥰

  1