Html 右侧空白，仅适用于手机

我的页面右侧有一条垂直的白线。 这只发生在手机上。使用设备工具栏找到它：

我设计了“手机第一”网站。仅用于桌面的媒体查询

我尝试了以下代码，但没有成功

html body{
    width: 100%;
    margin: 0; 
    padding: 0;
    overflow-x: hidden;
}

---

你能推荐点什么吗？

这是因为你的图像有一个设定的宽度，刚好比手机屏幕宽

如果向图像添加最大宽度，则可以保留设置的宽度。这将意味着它将是相同的大小，你原来除了当屏幕太小，然后它将占据整个宽度

.about-section img {
    width: 28rem;
    max-width: 100%;
}

---

在开发工具上设置

.about部分img

，似乎可以删除空白。在移动屏幕上尝试使用21 rem

.about-section img {
    width: 21rem;
}

---

尝试将body/html宽度添加为视口长度-->

width:100vw