Css 添加：将内容添加到子元素之前

我简化了以下内容：

<ul class="menu">
  <li class="button-1">
    <a href="somewhere">Link</a>
  </li>
</ul>

它将图标完全设置在文本链接上方。但它是不可点击的。因此，我试着

.button-1 a:before

但这不起作用。也没有我能想到或发现的任何其他变化。我觉得我在这里太愚蠢了，错过了一些显而易见的东西。任何建议。谢谢

当您在孩子身上使用

:before

时，即

.button-1>a:before

:

.button-1>a:在{
内容：“）；
}

HTML中没有

.button

类。这是

.button-1

。fontawesome图标对我来说是可以点击的（目前在使用Safari的iPad上），但它没有下划线。抱歉-在简化代码时，我无意中弄错了类名。假设它们都是正确的，并且都是“按钮”。谢谢。它似乎在选择器中没有所需的父项的情况下工作，但是如果它是一个很棒的图标，它没有下划线，但是可以单击。我不明白你的意思（？）谢谢Johannes。我已经试过了，但它不起作用。我不明白为什么。使用Chrome 87.0.4280.141试试看：为

左

使用不同的设置（也可能是一个百分比值），为

按钮-1

添加负的

顶部

设置和

填充顶部

，并调整这些值，直到找到满意的解决方案。谢谢Johannes。你帮了大忙。谢谢你的时间。

.button-1 a:before