Chrome现在是模糊文本时,使用转换翻译与百分比



几天以来,我在使用css3变换(transform: translateY(-50%);)垂直居中的非常酷的技术时,我正在尝试一个相当大的问题。这里描述:

https://davidwalsh.name/css-vertical-center

实际上,包含在这个div中的元素(文本或图像)会变得模糊。

我尝试了很多技巧(transform: translateZ(0);backface-visibility;(1)规模;translateX(calc(-50% + 0.5px));过滤器:模糊(0);等等)。

唯一有效的方法是使用另一种技术来垂直居中div,如display:table-cell.

但是,出于明显的原因(比如添加div容器的义务),我宁愿不这样做。

我有两个问题:

首先,你知道一个有效的技术吗?第二,这是最后(或最新)版本Chrome的新问题吗?

谢谢你的帮助,

大卫

PS:所有旧的解都表示在这里基于webkit的模糊/扭曲文本后期动画通过translate3d不要工作

目前,我发现只有一个好的解决方案:

transform: translate(-50%, -50.1%)
  • 0.1% -一般用户看不到这个
  • 无需计算值

希望chrome会修复它-自2014年以来存在的错误))))

相关内容

  • 没有找到相关文章

最新更新