Html 是否在移动视图中正确显示页脚元素？

我在移动屏幕大小上定位页脚中的图像时遇到问题。它在浏览器中看起来很棒，但在手机中图像从底部被切断，版权在带徽章的图像上方

以下是我在页脚主题自定义设置的自定义html块中使用的css：

    <div>
    <img src="https://cdn.shopify.com/s/files/1/0449/8210/8310/files/Sacred-Footer-layout-icons.jpg?v=1611374743" 
  style="position: relative;
  right: 0px;
  width: 400px;
  padding: 0px;">
</div>
<div style="text-align: center !important;">
     <small>
    © 2021 Sacred Coffee Co.
    </small>
</div>

©2021神圣咖啡公司。

这是我的网址。

---

谢谢你的帮助

使用代码，如果与现有CSS有任何冲突，则进行更改

@media screen and ( max-width:749px ){
   /* hide the last line and hr */
   footer .page-width:last-child,.site-footer__hr {
      display: none;
   }
   .site-footer__content {
      height: auto;padding: 0;
   }
   .site-footer__item-inner.site-footer__item-inner--html_content {
      display: flex;
      flex-direction: column;
   }
   .site-footer__item-inner.site-footer__item-inner--html_content div:first-child {
      order: 1;
   }
}

---

为img标记使用以下css属性

img{
      max-width: 100%;
      height: auto;
 }

---

谢谢你的帮助！