I have been working on my angular application and recently created a footer component that I want to stay at the bottom of the page like a typical footer. The footer component is included in the default app.component.html file, which makes it visible on the screen.
However, the footer appears at the top of the page instead of the bottom. I have attempted a couple of solutions to make it stick to the bottom.
Firstly, I tried modifying the global styles.css file by adjusting the position of the footer component to the bottom of the page:
.app-footer{
position:absolute;
bottom:0;
}
Then, I experimented with changing the styles in the footer.component.css file:
body {
position:absolute;
bottom:0;
}
Unfortunately, neither of these approaches worked for me. Can someone provide insight into why my methods failed and offer guidance on how I can successfully keep the footer at the bottom of the page?