我正在使用下图中绘制的响应式 Web 布局。红色区域固定在屏幕上，绿色区域是可独立滚动的部分（蓝色 = 滚动条）。
我想知道 - 有没有办法（没有 iframe）获取这个布局的主要内容部分（右侧的绿色区域）并将其视为视口本身，以便内容和样式可以像是自己独立的全面屏吗？
我尝试这样做的原因是因为我希望尽可能简单地将第二个网站的内容直接放入这个主要内容部分，而不必调整所有页面以适应更窄的部分的网站。
第二个站点是使用 twitter bootstrap 构建的脚手架，并且由于容器都是相对于某人的视口大小创建的，因此它们不能整齐地放入稍窄的内容区域（给定左侧边栏），而无需调整所有脚手架. 我宁愿不必调整许多页面上的所有内容，因此，我正在寻找一个技巧，看看我是否可以让它适合（交叉手指，有些东西存在！）
此外，左侧边栏是可折叠的——因此在某些情况下，主要内容部分会占据视口的整个宽度。因此，我希望它能够动态调整。
好像我有3个选择：
- 浏览第二个站点的每个页面并重新设计每个页面中的所有脚手架，以确保它们使用稍窄的部分，基本上将左侧边栏视为第一个跨度列，然后调整整个站点以在剩余宽度。 这个选项实际上不起作用，因为如果侧边栏被折叠，那么主要内容区域会占据整个宽度并且现在会更窄。
- 使用 iFrames - 由于所有影响，我不考虑这个。
- 不知何故，将主要内容区域视为自己的视口，以便所有脚手架都调整到它的大小，就好像它是视口本身或全屏一样。
这有可能吗？
是否有可能更好的替代解决方案？
谢谢！