Why did form drop below footer in Internet Explorer 11?

Question

css

header, main and footer are all in the body with the class page styled like this:

.page {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
  font-family: "museo-sans", Helvetica, sans-serif;
  font-size: 20px;
  line-height: 1;
  color: #2f2e2f;
  box-sizing: border-box;

In Opera, Chrome, Firefox, Edge, Brave browsers - everything looks great. And in IE, the form that should have been above the footer has slipped below it. Here is a link to the site.

Answer 1

for .page, height: 100%;replace with min-height: 100%;
Do not strictly limit the height - because of this, the section with the form does not fit into main