由于搜索图标，搜索栏文本被覆盖

【问题标题】：Search bar text getting covered due to search icon由于搜索图标，搜索栏文本被覆盖
【发布时间】：2018-08-28 15:18:27
【问题描述】：

我想将我的搜索图标放在搜索栏的左侧，如下所示：

但是当我尝试这样做时，搜索栏文本会被图标覆盖，如下所示：

如何确保文本在图标之后开始？

【问题讨论】：

【解决方案1】：

将padding-left属性应用到具有适当像素数量的输入框。

.foo
{
    padding-left: 20px;
}

&lt;input type="text" class="foo" value="abcdefghijklmnopqrstuvwxyz"&gt;

【讨论】：