css - 变换 : translateY() works different each device

标签 css user-agent

我申请了

position: absolute;
left: 0;
-webkit-transform: translateY(40%);
-moz-transform: translateY(40%);
-ms-transform: translateY(40%);
-o-transform: translateY(40%);
transform: translateY(40%);

//translateY(10%) on mobile

这在元素上。

在其他电脑或手机上。看起来不错。
像这样

enter image description here

但是在我的电脑上。
看起来很奇怪..
像这样(移动开发者模式)

为什么会这样??

这是我的用户代理

Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.82 Safari/537.36

enter image description here

enter image description here

最佳答案

我认为您需要给出最高值或最低值才能正常工作。某些浏览器需要第一个位置才能将其转换为新位置。

编辑:或者你可以给 top: 40%;?

关于css - 变换 : translateY() works different each device,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38705513/

相关文章:

html - 将移动设备重定向到我网站的替代版本

javascript - 基于UA的动态PHP内容条件加载

ssl - nginx多一个ssl配置

javascript - 使用 Jquery 2 的菜单栏

css - 在 CSS 显示 :table, 中,如何保持一致的单元格宽度?

html - 父 div 不要包裹子 div

css - SVG 比例变换具有运动

ios - Cordova 2.3 Phonegap InAppBrowser URL 白名单错误

javascript - navigator.userAgent.match 中的/i 是什么

php - URL 重写破坏了到 css 的链接