为什么在Safari上的transform translate不能正常工作？ [英] Why on Safari the transform translate doesn't work correctly?

问题描述

我经常使用此程式码来将 div 置于视图中央：

I often use this code to center a div in view:

.centered {
  position: fixed;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-50%, -50%);
}

它适用于Firefox，Internet Explorer和Chrome，

It works great on Firefox, Internet Explorer and Chrome, however not in Safari.

在Safari网络浏览器中将图片居中的解决方法是什么？

What's a workaround to center an image in Safari web browser?

推荐答案

p>您需要另一个供应商前缀样式。

You need another vendor prefixed style.

.centered {
  position: fixed;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

请参阅以下内容，了解哪个浏览器支持什么， 。
http://caniuse.com/#feat=transforms2d

Please refer below to know which browser supports what and what prefix has to be added. http://caniuse.com/#feat=transforms2d

这篇关于为什么在Safari上的transform translate不能正常工作？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！