Ambiera Forum

Discussions, Help and Support.

Ambiera Forum > RocketCake
Footer

Stephen C
Guest
Quote
2024-02-10 18:47:12

I have a Master Page with a Header and a Footer.
Is there way to make the Footer container 'stick' to the bottom of the page, so that regardless of other page lengths it will always be in the right place?


erik
Registered User
Quote
2024-02-10 20:21:55

If you want the footer to be always at the bottom, but also always visible (not sure if that part is what you want) you can set as additional css style for the footer this:
position: fixed; left: 0; right: 0; bottom: 0;



Stephen C
Guest
Quote
2024-02-11 11:29:10

Thank Erik. I tried that but it doesn't work.
On my Master page i have added the CSS you suggest to my Footer container. However, if I have a long page using the Master, the Footer is still at the halfway up the page, and not at the bottom. Am I doing something stupid here?


micaelo
Registered User
Quote
2024-02-11 12:41:25

I tried that but it doesn't work

I have tested a masterpage with a fixed navigation menu at the top, followed by a placeholder, followed by a fixed footer, all set to a max width of 1000, and all centered horizontally.

To get the footer fixed (and horizontally centered) at the bottom of the screen, no matter of page length, I have successfully tested this code:
 position: fixed; bottom: 0; left: 50%; transform: translateX(-50%); z-index: 100; 

This part of the code is to make the page content "slip" behind the footer, i.e. the footer remains visible all the time.
 z-index: 100; 



Stephen C
Guest
Quote
2024-02-11 17:39:55

Thank you Micaelo. I have tried this and I still can't get it to work. I will persevere!


micaelo
Registered User
Quote
2024-02-11 18:00:26

Thank you Micaelo. I have tried this and I still can't get it to work.

Here is my test rcd. Just download to see how I did it.
https://4hundert.de/share/fixedf...


Create reply:


Posted by: (you are not logged in)


Enter the missing letter in: "Interna?ional" (you are not logged in)


Text:

 

  

Possible Codes


Feature Code
Link [url] www.example.com [/url]
Bold [b]bold text[/b]
Image [img]http://www.example.com/image.jpg[/img]
Quote [quote]quoted text[/quote]
Code [code]source code[/code]

Emoticons


   






Copyright© Ambiera e.U. all rights reserved.
Privacy Policy | Terms and Conditions | Imprint | Contact