Order Summary Component Using Flexbox

Community feedback

• 

  Lucas 👾•104,340

  @correlucasPosted over 2 years ago

  👾Hello Busoalmi, congratulations for your new solution!

  Answering your question Busoalmi:

  To avoid your image losing its proportions while scaling use display: block and max-width: 100% to have the image scaling with the container

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

  Heres a media query to change the pricing section flow vertically":

  .plan {
      display: flex;
      align-items: center;
      flex-direction: column;
  }
  }
  

  👨‍💻 Here's my solution for this challenge if you wants to see how I build it: https://www.frontendmentor.io/solutions/order-summary-component-vanilla-css-custom-wave-background-hover-tEKUwaT2id

  👋 I hope this helps you and happy coding!

  0