order summary component

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  👾Hello @CarvalhoVincent, congratulations for your new solution!

  Your solution is already really good, the reason that its not responsive yet is due the width inside the container, button, header and pricing section, note that width is a fixed property this means that the size value doesnt change, instead use max-width this way you make these elements to have a maximum size but have the ability to decrease its size.

  To make your image fully responsive add display: blockand max-width: 100% and object-fit: cover to make the image auto-crop when resizing inside the column:

  img {
      display: block;
      object-fit: cover;
      max-width: 100%;
  }
  

  👋 I hope this helps you and happy coding!

  Marked as helpful

  0

  ---

  

  CarvalhoVincent•500

  @CarvalhoVincentPosted over 2 years ago

  Hello @correlucas and thank you for your comment, it helps a lot! I will try your suggestions in my next challenges. Happy coding!

  0