如何用HTML和CSS调整大图尺寸以覆盖整个div？

我希望将一张尺寸为5568x3712的图片设置为div的背景，但使用background-size: contain属性后，图片并未铺满整个div，右侧存在未覆盖区域。

以下是我的CSS代码：

.heroSection{
  background-image: url('../../public/hero-section.jpg');
  background-repeat: no-repeat;
  background-size: contain;
  background-color: rgb(148, 145, 145);
  background-blend-mode: multiply;
  flex-grow: 1;
}

我尝试过background-size: contain和background-repeat:no-repeat，但仍未解决问题，请问有没有更好的方案实现需求？

补充说明 #

经过多方实验与研究，无法将大图完美适配为小div的背景，需调整图片至合适尺寸才能实现完整覆盖，感谢@somethinghere和@koala Yeung的解答。

内容的提问来源于stack exchange，提问作者Rishabh Raghwendra