缩放元素以适合浏览器窗口

Question

有问题的页面是：http://amytdatta.com/ironic-bironic（密码：tyma） - 它是我工作的新相册的预发布页面，抱歉！

我希望将视频和文本导航设备缩小并居中到浏览器窗口，而无需使用滚动条。我使用min height / max height尝试了各种方法，但似乎无法获得预期的结果。我猜测我不知道要定位哪些元素以及如何定位它们。

对于一个良好的坚实方法的任何建议将非常感激。此外，由于我使用的是Virb，我只能覆盖CSS，因此我无法删除行。

非常感谢。

Answer 1

如果没有真正看到您的网站，因为它受密码保护，我会建议以下内容：

您可以在元素周围设置包装器，例如导航和视频。然后设置视频和导航的CSS以获得自动边距。哪个应该水平和真实地居中。您可能希望为2个组件添加一个包装器，以便将它们很好地堆叠在一起，然后在该包装器上放置一个自动边距，但下面的内容应该已经有效了。

HTML：

       <div id="container">
         <div id="nav"><!-- nav here --></div>
         <div id="video"><!--video here--></div>
        </div>

CSS：

#container {
  width:100%;
  height:100%;
}

#video{
  margin:auto;
}

#nav {
  margin:auto;
}