在带有背景图像的导航栏上缩进一个项目

Question

我正在尝试创建一个导航栏，其中只有一个第一个项目具有背景图像和缩进文本。 这是代码：

<ul>
   <li><a href="index" id="home">home</a></li>
   <li><a href="#">serviços</a></li>
   <li><a href="#">produtos</a></li>
   <li><a href="#">galeria</a></li>
   <li><a href="#">contactos</a></li>
</ul>

当我使用此css：#home{ text-indent: -9999px; background: url(../img/homeIcon.svg) no-repeat center;}定位到家庭ID时，整个链接都会消失，而当我不缩进文本时，文本会重叠图标。我正在尝试将此应用于该链接。 任何人都可以帮助我吗？