3-column-card

Community feedback

• 

  Lucas 👾•104,400

  @correlucasPosted over 2 years ago

  👾 Hello Priyanka Reddy, congratulations for your solution!

  Your component has all the design elements good done, but isn't responsive yet. This is due the width you've set for the #main and all the 3 cards inside this container. You need to replace this width with max-width in order to have component responsive and contracting when the screen scales down. I did some fixes to your code, see below:

  #main {
      max-width: 950px;
      height: 550px;
      border-radius: 20px;
      margin: auto;
      margin-top: 70px;
      font-family: 'Lexend Deca', sans-serif;
      display: flex;
  }
  
  #sedans, #suvs, #luxury {
      max-width: 33%;
  }
  

  Pay attention that in this case, this challenge, there's no need to use id, give preference for class and the id use it when you work with forms or Javascript.

  Hope it helps and happy coding!

  0