html - Div 背景没有绘制整个 Div

我有以下代码:

来源:

<html>
<head>
<title>Testing on IE 11</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body {
  margin: 0;
  padding: 0;
  background-color: #d6ffbb;
}
.page-container {
  padding: 10px;
}
footer {
  text-align: justify;
  font-family: Arial;
  font-size: 14px;
  letter-spacing: normal;
  padding: 20px;
  color: #fff;
  background: url("https://i.ibb.co/hYXDL2N/pattern-dark.jpg") top center
    repeat;
}
/* BEGIN OF CODE BLOCK FOR STICKY FOOTER */
body {
  display: -webkit-box !important;
  display: -ms-flexbox !important;
  display: flex !important;
  height: 100%;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}
.page-container {
  -webkit-box-flex: 1;
  -ms-flex: 1 0 auto;
  flex: 1 0 auto;
}
/* END OF CODE BLOCK FOR STICKY FOOTER */
</style>
</head>

<body>
  <div class="page-container">
    hello world<br />
    hello world<br />
    hello world<br />
    hello world<br />
    hello world<br />
    hello world<br />
    hello world<br />
    hello world<br />
    hello world<br />
    hello world<br />
    hello world<br />
    hello world<br />
    hello world<br />
    hello world<br />
    hello world<br />
  </div>
  <footer>
    <p>
      Lorem Ipsum is simply dummy text of the printing and typesetting
      industry. Lorem Ipsum has been the industry's standard dummy text ever
      since the 1500s, when an unknown printer took a galley of type and
      scrambled it to make a type specimen book. It has survived not only five
      centuries, but also the leap into electronic typesetting, remaining
      essentially unchanged. It was popularised in the 1960s with the release
      of Letraset sheets containing Lorem Ipsum passages, and more recently
      with desktop publishing software like Aldus PageMaker including versions
      of Lorem Ipsum. Lorem Ipsum is simply dummy text of the printing and
      typesetting industry. Lorem Ipsum has been the industry's standard dummy
      text ever since the 1500s, when an unknown printer took a galley of type
      and scrambled it to make a type specimen book. It has survived not only
      five centuries, but also the leap into electronic typesetting, remaining
      essentially unchanged. It was popularised in the 1960s with the release
      of Letraset sheets containing Lorem Ipsum passages, and more recently
      with desktop publishing software like Aldus PageMaker including versions
      of Lorem Ipsum. Lorem Ipsum is simply dummy text of the printing and
      typesetting industry. Lorem Ipsum has been the industry's standard dummy
      text ever since the 1500s, when an unknown printer took a galley of type
      and scrambled it to make a type specimen book. It has survived not only
      five centuries, but also the leap into electronic typesetting, remaining
      essentially unchanged. It was popularised in the 1960s with the release
      of Letraset sheets containing Lorem Ipsum passages, and more recently
      with desktop publishing software like Aldus PageMaker including versions
      of Lorem Ipsum. Lorem Ipsum is simply dummy text of the printing and
      typesetting industry.
    </p>
    <p>
      Lorem Ipsum is simply dummy text of the printing and typesetting
      industry. Lorem Ipsum has been the industry's standard dummy text ever
      since the 1500s, when an unknown printer took a galley of type and
      scrambled it to make a type specimen book. It has survived not only five
      centuries, but also the leap into electronic typesetting, remaining
      essentially unchanged. It was popularised in the 1960s with the release
      of Letraset sheets containing Lorem Ipsum passages, and more recently
      with desktop publishing software like Aldus PageMaker including versions
      of Lorem Ipsum. Lorem Ipsum is simply dummy text of the printing and
      typesetting industry. Lorem Ipsum has been the industry's standard dummy
      text ever since the 1500s, when an unknown printer took a galley of type
      and scrambled it to make a type specimen book. It has survived not only
      five centuries, but also the leap into electronic typesetting, remaining
      essentially unchanged. It was popularised in the 1960s with the release
      of Letraset sheets containing Lorem Ipsum passages, and more recently
      with desktop publishing software like Aldus PageMaker including versions
      of Lorem Ipsum.
    </p>
  </footer>
</body>
</html>

演示: https://yv983q28xx.codesandbox.io/

此代码在以下平台上运行良好:{ Chrome、Firefox、Edge }。

但是在 IE11 上运行时，我得到以下行为:

滚动到顶部: scrolled to top