bootstrap 레이아웃 숙제관련

안녕하세요, 부트스트랩 레이아웃 숙제를 하고 있는데 
아무리 해도 저 상단의 사진 상단과 좌우의 하얀 여백이 없어지지 않아서 질문드립니다.
개발자도구로 살펴봐도 아무 마진, 패딩, 보더 값이 없는데 화면에서는 계속 여백이 존재합니다, 어떻게 해야 없어질까요?! ㅠ



 

  <div class="card shadow" style="width: 350px; border: none;" >
    < img src="card2.png" class="card-img-top" style="object-fit: cover; display: block;">
    <div class="card-body">
      <span class="badge rounded-pill text-bg-primary">News</span>
      <h5 class="card-title pt-2">Card title</h5>
      <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
      
      <div class="d-flex align-self-center">
        <div class="flex-shrink-0">
          < img src="car1.png" width="50px" height="50px" class="rounded-circle">
        </div>
        <div class="flex-grow-1 ms-3">
          <p class="fw-semibold p-0 m-0">Kelly Rowan</p>
          <p class="text-body-secondary p-0 m-0">March 12, 2021, 6min read</p>
        </div>
      </div>
    </div>
  </div>