5

I'm trying to move an embedded element with the CSS3's transform: translate3d() method. It works perfectly in every browser, except for Safari, which doesn't seem to move the video/audio itself but manages to move the embedded element.

Here's the fiddle.

I've moved a container div to the right with translate3d(). I've also set a border for the div and the embedded element/object.

HTML

<div class="audio">
    <object height="50" width="100"
     data="http://www.w3schools.com/html/horse.mp3"></object>
</div>

CSS

.audio{
    -webkit-transform: translate3d(300px,0,0);
    -ms-transform: translate3d(300px,0,0);
    -o-transform: translate3d(300px,0,0);
    transform: translate3d(300px,0,0);
}

Is this an unfixable bug or does anyone have a fix?

EDIT:

Safari 5.1.7 on Windows 8.1

Safari 5.1.7 on Windows

4

1 回答 1

2

如果我是你，我会权衡寻找修复的成本与你会影响的实际用户。我认为没有足够的用户来证明试图找到修复程序是合理的，特别是因为对问题的描述听起来可能是 Safari 5 的错误。

Safari 5.7 甚至没有出现在CanIUse上transforms3d

而Safari 5 在 4 月份仅占互联网用户的 0.2%，而且该统计数据甚至没有显示 Windows 和其他操作系统之间的差异，因此它可能会更少。

我试图找到在 Virtual Box: Windows 8.1 中运行的 Safari 5 版本，但我什至找不到它......

于 2015-05-27T14:53:39.293 回答