无法点击href标记链接

Question

我有一个html结构，就像侧边栏菜单一样：

<div class="sidebar sidebar-main">
   <div class="wk-seller">
      <div class="section">
         <a class="store-name" href="https://booyaa.id/marketplace/seller/feedback/shop/adityathevendor">
         Penilaian                      </a>
      </div>
      <div class="section">
         <a class="store-name" href="https://booyaa.id/marketplace/seller/profile/shop/adityathevendor#return-policy">
         Return Policy                          </a>
      </div>
      <div class="section">
         <a class="store-name" href="https://booyaa.id/marketplace/seller/profile/shop/adityathevendor#shipping-policy">
         Kebijakan Pengiriman                           </a>
      </div>
   </div>
</div>

问题是我将伪元素样式添加到sidebar-main，如下所示：

.sidebar.sidebar-main:before {
    content: '';
    position: absolute;
    left: 0;
    right: 22px;
    border: solid 1px #dae2e6;
    top: 0;
    bottom: 0;
    border-radius: 2px;
}

它使得这个html结构中的href标签不可点击，我该如何解决这个问题？

Answer 1

你有一个覆盖该区域的伪元素.sidebar.sidebar-main::before。如果您确实需要该伪元素，请确保将pointer-events: none;添加到其CSS中以使其点击。