在拐角处，我会告诉你我有什么。
我想通过视频html5标签在固定的div中显示视频。我通过使用最小高度和最大高度来最大化它。但我也希望它以中心为中心。@H_502_3@
<div class="fixed-width-height">
<video style="min-width:100%; min-height:100%;" controls autoplay>
<source src="myvid.mpg" type="video/mp4">
Your browser does not support the video tag
</video>
</div>
现在，div总是显示视频的上部或左部，具体取决于div的大小。最好总是显示中心。提前Thx！@H_502_3@
更新：
视频标签现在居中，jbutler483很好的工作，但是视频大小取决于帧数div或视频比例或大小存在问题。视频不覆盖整个区域或定心失败。这是一个符合400×400盒子需求的剪辑，但是在1000×200下失败。 http://jsfiddle.net/cremers/7Lgfyg1d/6/@H_502_3@
更新：
找到了非IE的工作解决方案：object-fit：cover;对象的位置：中心;但我想要一个完整的工作解决方案。@H_502_3@
更新：
Polyfill应该提供所需的功能，我将在viedo标签上测试这个日子，thx到Philip Dernovoy。
更新：我很抱歉，但我没有工作。@H_502_3@
解决方法
您可以使用定位和翻译的组合来实现：
.fixed-width-height {
position: relative;
}
.fixed-width-height video {
position: absolute;
top: 50%;
left: 50%;
-webkit-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
<div class="fixed-width-height">
<video style="min-width:100%; min-height:100%;" controls autoplay>
<source src="myvid.mpg" type="video/mp4">
Your browser does not support the video tag
</video>
</div>
注意：@H_502_3@
这将会/应该适用于所有浏览器栏IE8> =和Opera Mini，如图所示here在这些浏览器中，视频将显示在fixed-width-height元素的左上角(尽管仍将起作用)。@H_502_3@
如果你想“覆盖”整个div，你可以使用：@H_502_3@
.fixed-width-height video{
position:absolute;
top:0;
left:0;
height:100%;
width:100%;
}
以便完全覆盖相对定位的父母的伸展。@H_502_3@
