CSS：当父级更宽时，使子宽度适合视口？

Question

当CSS的父元素比视口宽时，是否可以单独使CSS元素的宽度适合视口？

我正在设计一个用户界面以适应现有的，无响应的，固定宽度的网站布局，我还没有（还）可以直接控制，我希望至少我的界面能够响应健康移动屏幕，即使整体网站布局没有。包含我的界面的页面至少能够为界面的样式加载额外的CSS文件，但利用这个来改变使用我的界面的页面上的整体网站布局是一个冒险的主张。

如果CSS可以动态扩展我的界面DIV宽度以适应任何视口大小，我宁愿不必使用@media查询设置一系列固定宽度断点。有关说明，请参阅此模型：

Layout Mockup

...我控制内容DIV并希望其宽度适合任何视口，如图所示，但我无法控制固定宽度的容器，页眉和页脚DIV

Answer 1

是！

使用vw和vh单位。 100vw等于视口宽度，而100vh是视口高度。

http://css-tricks.com/viewport-sized-typography/

同时确保在处理移动设备时包括

<meta name="viewport" content="initial-scale=1" />

因此默认情况下它不会完全缩小。