Sticky footer in Angular 2 Material

Question

I have been searching and searching for about 3 hours now because I didn\'t want to have to ask, but how can I keep a \'footer\' variable at the bottom but not like fixed at the

Answer 1

The answer can be found here: Sticky footer at the bottom in Angular 2

Solution

app {
  min-height: 100%;
  width: 100%;
  margin-bottom: -271px;
  display: table;
}

header-main,
router-outlet,
footer{
  display: table-row;
}

header-main {
 height: 60px;
}

router-outlet {
  position: absolute;
}

footer {
  height: 271px;
}