背景图片位置错误

Question

我有一个带有背景图像的文本标题，使用这个 css 将文本圈起来：

.page-id-44491 #page-header-bg h1 {
font-size:69px !important;
text-transform:uppercase;
background: url(http://rocketcafe.co.uk/wp-content/uploads/2015/12/scribble.png) no-repeat;
background-size: 500px 200px;
background-position: 50% calc(50% - 5px);
}

这在大多数浏览器中都能完美运行，我认为是大多数设备 - 但我昨天在三星平板电脑上看到了该网站，但背景图片根本没有定位。

你可以在这里看到两个比较（第二个是客户发送的，质量不是很好）

网站是http://www.rocketcafe.co.uk/

示例如下：

https://www.dropbox.com/s/mxmmtmtz0pfshhu/Screen%20Shot%202016-02-27%20at%207.15.55%20PM.png?dl=0

https://www.dropbox.com/s/i4snyu96nsxkeo9/12782387_10153893672215729_994231173_n.jpg?dl=0

有谁知道这是为什么？背景图像属性或 calc 函数没有供应商前缀，所以我不知道为什么这不起作用？

任何帮助将不胜感激。

谢谢

Answer 1

很遗憾，我无法为您提供完整的答案。但我可以帮忙。

这是一个 Android 浏览器的屏幕截图。对开发人员来说是纯粹的邪恶。函数 calc（可能是更少的函数。我用的更少）在那里不起作用。

请看这里。也许this answer 可以帮助您或有人提供适合您的替代方案。