Javascript 在宽屏幕上显示高视频时，居中webrtc视频流内容

我正在手机和笔记本电脑之间进行webrtc视频通话，手机处于纵向模式，因此它发送的流的高度大于宽度，笔记本电脑发送的流的纵横比颠倒

我希望视频全屏显示，我使用了以下css：

位置：固定；
左：0；
排名：0；
右：0；
底部：0；
对象匹配：包含；
物体位置：50%50%；
身高：100%；
最小宽度：100%；
身高：100%；
宽度：100%无需做太多事情来调整视频中心。只需使用
object-fit:cover，（大多数现代浏览器支持）显示在显示容器上，所有操作都将自动完成。
如何切断？上面还有其他元素吗？可能是另一个元素的CSS规则引起了麻烦。一般来说，它应该与
对象匹配：contain
一起工作。屏幕的宽高比是16:9，流的宽高比是9:16，基本上我试图在非常宽的屏幕上显示一个非常高的视频，视频在全屏中只显示实际流的顶部，对象匹配：contain似乎不起作用，topI上没有其他元素使用垂直视频更新了我的示例。即使屏幕很宽，它也会缩放视频并将其居中，就像
背景尺寸：封面。你能分享多一点你的CSS或HTML吗？屏幕截图也可能有帮助。谢谢，我会尝试一下，然后再回复你。谢谢@Fabianshultz，我的css是错误的，我不得不使用object fit:cover，并且不得不增加父分区的大小。请注意，这在任何版本的IE中都不起作用。这对WebRTC来说都不是问题，因为他们甚至都不支持@FabianSchultz的评论解决了这个问题，这是由于我使用了不正确的css，因为他没有提供答案，我接受你的回答。