Footer banner
I would add a page layout (or modify and existing page layout) and add a Bottom Section to the Layout Container. Then you can add the copyright text in the Bottom Section. See example below with page layout from Atlas_Core:
Hi Aashu,
Try to use HTML Snippet and adjust the css as per your need. i am putting a sample code below. Hope it works.
<!DOCTYPE html> <html> <head> <style> /* CSS styles for the banner */ .banner { text-align: center; position: relative; overflow: hidden; } .banner a { text-decoration: none; color: #333; margin: 0 10px; } .banner-inner { display: inline-block; white-space: nowrap; } </style> </head> <body> <div class="banner"> <div class="banner-inner"> <h1>Mendix</h1> </div> </div> <!-- Rest of your HTML content --> </body> </html>
What kind of page templates are you using? this becomes key in taking the next step in answering this.
Mikes answers is right but then the content section is scrollable so as to make the content scroll with footer in the bottom of the current view port always! (like you said in your comment)
the trick is to make the content not scroll here and in the page(not in the template) add the copyright section as the last element) – this way the copyright element will try to follow the content all the time.
The issue now is: if the content is less, then the copyright will appear somewhere near the top of the page :P
So 1 solution in pure CSS is to identify the container which has the content and the copyright sections as children. To the container give the below styles:
display: flex; flex-direction: column; to make them stack on each other.
then go the second row and make it sit stick to the bottom of the page by using below styles:
position: absolute; bottom: 0
Mind you, there could be other easy ways for this but the best way would be to make a new Page Template for you and solve this at the root.
All the best.