Order summary component

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  👾Hello Treasure, congratulations for your new solution!

  Your solution design is perfect, but there are some fixes to do in order to enable the responsivity.

  1.Replace all properties with width inside the card and use instead max-width. Note that if you use width this means that the card will not grow or contract, using max-width instead allows the container to contract and have the maximum size to grow.

  .card {
      max-width: 327px;
      /* height: 567px; */
      background-color: white;
      border-radius: 20px;
      display: flex;
      flex-direction: column;
      align-items: center;
      box-shadow: 0px 40px 40px -20px rgb(13 48 189 / 15%);
  }
  

  2.To have the image resizing with the container use max-width: 100% and display: block

  👋 I hope this helps you and happy coding!

  Marked as helpful

  0