Firefox CSS占位符问题

Question

我正在尝试为我的输入占位符设置动画。实际上，它适用于Chrome，但我在使用firefox时遇到了麻烦。

这是我的SCSS：

input[placeholder], :-moz-placeholder, ::-moz-placeholder {
  -moz-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  position: relative;
  -moz-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);

  &[style*=hidden] {
    color: $gold;
    font-size: 12px;
    -moz-transform: translate3d(0, -25px, 0);
    transform: translate3d(0, -25px, 0);
    opacity: 1;
    visibility: visible !important;
  }
}