Order Summary component (CSS + Simple Hover effects)

Community feedback

• 

  Lucas 👾•104,400

  @correlucasPosted about 2 years ago

  👾Hello Naleeka, congratulations for your new solution!

  Another great solution and great design! Your solution is almost done and I've found only one thing you can improve, the responsiveness. I saw that you've used media queries but you don't really need that for this challenge.

  There are 3 factors that are making the card doesnt contract and behave responsive. The heading, the pricing section and the button. You've used width: 100% for this elements and this make the container behave like a block and dont contract scaling the elements, note that width: 100% means that these elements has 100% of the container theyre inside and be fixed, to make they responsive replace with max-width: 100%. Also something to improve the image resposiveness is to use display block and object-fit: cover to make it crop inside the container.

  👋 I hope this helps you and happy coding!

  Marked as helpful

  1

  ---

  

  Naleeka•470

  @NaleekaPosted about 2 years ago

  @correlucas Thanks man ! <3 I will make the changes

  0