xErik · February 16, 2022 19:56
diff --git a/components>footer>footer.component.html b/components>footer>footer.component.html
 <!-- create this file via: ng generate component footer -->

 <footer class="bg-dark text-white mt-4">
  <div class="container-fluid py-3">
    <div class="row">
      <div class="col-md-3">
        <h5>Footer</h5></div>
      <div class="col-md-3"></div>
      <div class="col-md-3"></div>
      <div class="col-md-3"></div>
    </div>
    <div class="row">
      <div class="col-md-6">I stay at the bottom of the viewport! <span class="small"><br>Unless the page content pushes me further.</span></div>
      <div class="col-md-3"></div>
      <div class="col-md-3 text-right small align-self-end">©2017 Brand, Inc.</div>
    </div>
  </div>
 </footer>
diff --git a/src>app>app.component.html b/src>app>app.component.html
 <app-header></app-header>
  <section class="container">
    <router-outlet></router-outlet>
  </section>
 <app-footer class="mt-auto"></app-footer>
diff --git a/src>index.html b/src>index.html
 <!DOCTYPE html>
 <html lang="en" class="h-100">
  <head>
  <!-- bla -->
  </head>

  <body class="h-100">
    <app-root class="d-flex flex-column h-100"></app-root>
    <noscript
      >Please enable JavaScript to continue using this application.</noscript
    >
  </body>
 </html>
	<app-header></app-header>
	<section class="container">
	<router-outlet></router-outlet>
	</section>
	<app-footer class="mt-auto"></app-footer>
	<!DOCTYPE html>
	<html lang="en" class="h-100">
	<head>
	<!-- bla -->
	</head>

	<body class="h-100">
	<app-root class="d-flex flex-column h-100"></app-root>
	<noscript
	>Please enable JavaScript to continue using this application.</noscript
	>
	</body>
	</html>