transform: translateY(-50%) --- Chrome“无效属性值”错误，为什么？答案

【问题标题】：transform: translateY(-50%) --- Chrome "invalid property value" error, why?transform: translateY(-50%) --- Chrome“无效属性值”错误，为什么？
【发布时间】：2015-01-10 10:31:45
【问题描述】：

Chrome 为我提供了 transform: translateY(-50%) 的“无效属性值”。我已经使用了必要的供应商前缀。在其他浏览器中没有问题。

有什么想法吗？

更新：
如果有帮助，这里是上下文（使用 Sass 缩进语法）：

.modal
  background: #fefefe
  border: $modal--util solid 1px
  border-radius: 2px
  left: 0 
  right: 0
  margin-left: auto
  margin-right: auto
  z-index: 12
  max-width: 380px
  overflow: hidden
  visibility: hidden
  position: fixed
  top: 50%
  transform: translateY(-50%)

【问题讨论】：

请再次检查您的错误，它在我身边工作正常。这是小提琴：jsfiddle.net/b0vgajoq
works fine transform:translatey(-50%); 请检查您的代码
检查，重新检查，并继续重新检查。要么我失明，要么发生了一些有趣的事情......我会用我完整的 css 选择器声明更新问题，以防有人发现问题。
分号在哪里？你用的是 Sass 还是什么的？
@IsaacGregson 请同时检查 CSS 输出。

标签： css google-chrome cross-browser css-transforms

【解决方案1】：

卸载并重新安装 Chrome，问题就消失了……我认为 Chrome 没有自动更新（我在 Linux 上）。

【讨论】：

【解决方案2】：

在遇到同样的问题后发现了这个。我从 Windows 的计算器中复制了一个值。在我的 IDE 中一切正常：transform: translateY(-‭85.71428571428574‬%)。然而，在部署代码时，小数点被插入为&#8237;。因此到达浏览器的实际值是transform: translateY(-&#8237;‭85.71428571428574‬%)。

手动输入值后问题就消失了。

我希望这对遇到同样问题后可能偶然发现此问题的人有所帮助。

【讨论】：