html - 字体真棒图标和输入字段边框重叠在移动设备上可见

Question

在登录页面上，输入字段前面有很棒的字体图标。为了在两者周围有一个漂亮的框边框，我为图标和输入字段应用了边框属性，并分别删除了右边框和左边框，使其看起来像一个单独的框。

我现在面临的问题是当我切换到移动视图时，两者的边框重叠清晰可见（请看截图），但桌面版看起来不错。

如何解决移动视图上的此边框重叠问题？

Answer 1

我建议将两者都放在带有边框样式的 div 中，并禁用图标的边框和输入。