Javascript 或 CSS 修复 100% <div> 在 IE11 缩放时不填满页面

Question

我有一个滚动

，它应该填充页面的可见区域:

<div id=allcontent style="width:100%;height:100%;overflow:scroll">
   (all page content)
</div>

当我使用 ctrl+ IE11 放大时，我的 div 的下方和右侧有额外的空间，在那里我可以看到 背景色。 p>

我想在 IE 放大时调整“allcontent”div 的大小 以填充页面，但我找不到获取实际页面大小的方法使用 JavaScript。

是否有:

1. 一种在单击 ctrl+ 或

后从 IE11 获取实际页面大小的方法

2. 一种方法可以在 CSS 中指定

   尺寸，使其随页面正确调整大小？

我已经尝试了各种测量方法，例如 ocument.body.clientWidth，但没有发现任何适用于我的

之外的新可见区域的方法。

甚至更奇怪:页面缓慢滚动以掩盖(错误地)暴露的主体颜色。

最佳答案

问题出在 IE11 的“自动缩放至视口(viewport)宽度”功能。解决方法是将以下内容添加到我的 CSS:

@media screen {
  @-ms-viewport {
    width: device-width;
  }
}

Microsoft: Internet Explorer...当窗口窄于 1024 像素时自动缩放内容...在不需要或不需要这种自动缩放的情况下，device-width 关键字... . 表示页面经过优化，无论设备的宽度如何都能正常工作。

我在 this question 中找到了答案.

关于Javascript 或 CSS 修复 100% <div> 在 IE11 缩放时不填满页面，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/27764769/

上一篇：HTML 文本/CSS 变量

下一篇：javascript - 如何使用 jQuery 在 asp 中隐藏/显示带有下拉列表更改的面板

Answer 1

问题出在 IE11 的“自动缩放至视口(viewport)宽度”功能。解决方法是将以下内容添加到我的 CSS:

@media screen {
  @-ms-viewport {
    width: device-width;
  }
}

Microsoft: Internet Explorer...当窗口窄于 1024 像素时自动缩放内容...在不需要或不需要这种自动缩放的情况下，device-width 关键字... . 表示页面经过优化，无论设备的宽度如何都能正常工作。

我在 this question 中找到了答案.