在CSS中挖掘社交媒体按钮

Question

所以我使用CSS创建了这些充满活力的社交媒体按钮。 经过几次动作后，您可以看到Instagram图标右侧有一条小红线。有什么理由导致这种情况以及如何删除它？

https://jsfiddle.net/pm9hkyy8/2/

段：

@keyframes pulser {
  from {
    color: rgba(0, 0, 0, 0.2);
  }
  to {
    color: rgba(255, 255, 255, 1);
  }
}
#footer a {
        color: #999;
        color: rgba(185, 186, 187, 0.5);
        animation-name: pulser;
        animation-duration: 2s;
        animation-iteration-count: infinite;
        animation-direction: alternate;
        animation-timing-function: ease-in-out;
}

/* Stopping the pulsation on hover for that particular child */
a:hover {
  color: #bbb;
  color: #b9babb;
  animation-name: pulser;
  animation-duration: 2s;
  animation-iteration-count: 0;
  animation-direction: alternate;
  animation-timing-function: ease-in-out;
}

此外，随意使用此代码并改进它:)

屏幕截图：http://puu.sh/qJBkj/d3701d834e.png

Answer 1

删除下面的空白CSS并导致该行

            #footer .actions li a:before {

            }

https://jsfiddle.net/Nagasai_Aytha/pm9hkyy8/4/