Order summary component using Bootstrap

Hello! I'm beginner in Bootstrap and I found out 1 thing in this challenge. The thing is when I added Image inside <div class="card">, there's a little white space between the left and right sides of the image and the gap. I tried setting paddings and margins to 0, but the result stays the same. How can I fix that? I've added my code snippet of adding image too.

`

<div class="card"> <img src="images/illustration-hero.svg" class="card-img-top" alt="...">

  <div class="card-body text-center px-5 pb-2">
    <h1 class="card-title pt-3 pb-2">Order Summary</h1>
  </div>

</div> `

Also, is my code of using bootstrap well-structured? Feel free to give me your feedbacks. Thank you 😁