Internet Explorer上的屏幕很小时会出现滚动条

Question

在屏幕尺寸小于700像素的IE 11上运行我的登录页面时，该网站如下所示：

右侧的空间导致不应存在的滚动条。我通常会认为有些东西溢出，但我没有看到任何会导致这种行为的内容。

以下是该网页代码的简要说明： https://codepen.io/bitz/full/brayEb/

我在想它与我设置宽度的方式有关：

html {
    height: 100%;
    width: 100%;
    margin: 0;
    background: rgb(90, 103, 113);
    font-family: Arial !important;
    font-size: 12px !important;
}

但我尝试改变它有点没效果。

Answer 1

尝试从CSS

中删除它

@media only screen and (max-width: 1000px) {
body#login-body 
  {
    background-size: contain;
   }
}

Answer 2

原来IE根本不喜欢transform css，所以我选择以不同的方式将对象居中，如outlined here。

基本上：

.outer {
    display: table;
    position: absolute;
    height: 100%;
    width: 100%;
}

.middle {
    display: table-cell;
    vertical-align: middle;
}

.inner {
    margin-left: auto;
    margin-right: auto; 
    width: /*whatever width you want*/;
}

而不是在codepen中使用的系统。