3 card component

Community feedback

• 

  Josh•1,110

  @josh76543210Posted over 1 year ago

  Hi @devFerreir,

  Good job on your solution!

  Here are some suggestions to improve your solution:

  Add a media query to improve the responsiveness of your page. This will align the card sections underneath each other when the screen gets smaller.

  @media only screen and (max-width: 600px){
    .card {
      flex-direction: column;
      max-width: 400px;
    }
  }
  

  Also, I would recommend removing the height of the card and changing the width to max-width. This will help to display the card better, especially on smaller screens.

  .card {
    max-width: 750px;
  }
  

  NOTE: The card sections are now arranged vertically in the media query. So you will have to add new border-radius values inside the media-query to match them to the new layout.

  I hope this is helpful for you.

  Happy Coding!

  Marked as helpful

  0