我一直在寻找解决这个问题的方法,但是直到现在我还没有找到任何解决方法。
我需要给视频一个绝对位置,它的大小会根据此位置而变化(通过提供上,右,下和左值)。当我这样做时,运行iOS 8+的iPhone上的播放按钮将停止居中。
这是正在发生的事情的打印:
Print screen from iPhone 5c
我已经能够在这里的JSFiddle上重现此错误:https://jsfiddle.net/hwgnzwzf/2/-似乎在设置“left”属性时开始发生。
<div class="video-holder">
<div class="video">
<div class="video-wrapper video-wide">
<video controls poster="http://placehold.it/200x200">
<source src="" type="video/mp4"/>
</video>
</div>
</div>
</div>
.video{
position: absolute;
top:0;
left:40%;
right:20%;
bottom:0;
}
/ edit:输入Doml后,我尝试仅设置“正确”值和“最大宽度”,但是最终结果是相同的。
最佳答案
问题是,iOS需要同时使用top和left这两个属性。底部/右,您只需将其设置为40%
将绝对容器“居中”的更好解决方案是将其放置在屏幕的中央,然后将其放回宽度的一半:
left:50%;
transform: translateX(-50%);
我没有iPhone,因此请告诉我这是否适合您
edit://哦,如果您想“调整大小”,只需为其添加一个最大宽度并删除“right”属性