How to fix container at the bottom?


I have created a customer portal where our customers can download our test results as a PDF. So far, we have printed out all test reports and sent them in an envelope by post.

Since the portal is not only shared internally in our company, but also with external users, I would like to create a footer and fix it at the bottom of the page (desktop view). I have created a container with the corresponding text and the link to the privacy policy and legal notice.

Unfortunately, I cannot fix the container at the end of the screen. My question is therefore: how can I solve this problem?


I think if you add a couple spacers that should do it.

Thanks Eric, but then I have white padding at the bottom (which I don’t want). It almost works, but it’s not the ideal solution.

Ok. Just to be clear… I meant put the spacers above the container which should force the container to the bottom… or you could put them in the container if you prefer

Yes. I put the spacers above the container (footer).

1 Like

That’s what I had in mind… but as the page fills up maybe you want the bottom container to be “sticky”?

If you have a paid plan you could try this css. Put the css under settings → appearance and give the bottom container the class name stickybottom under options. Always keep that container as the last component on your screen for the css to work properly.

.stickybottom {
position: -webkit-sticky;
position: sticky;
bottom: 0px;
z-index: 999;
margin-top: auto;

You can find this and a bunch of other helpful codes here


Thank you for your help! I am currently still a free user, is the customization of CSS also possible there or only from the price model “Maker”?

I’m really surprised that Glide doesn’t already include such a basic feature (footer). Is there no other option than CSS (and using the paid version)?

1 Like

My pleasure! CSS is only available on paid plans. From the screenshot it looks like you got what you wanted by just adding a few spacers above the container.

Is the issue that you want it to be “sticky” or is it something else?

Try adjusting the spacer some distance, or try increasing the height a little it might help. As far as I know, it works.

1 Like

Ahhh yes I see the tiny space now. Just add one more spacer and you should be good to go :+1:

If I add another spacer (or change the size), I have to scroll the page (which I don’t want to do). The footer should always be in the same place, no matter what the screen resolution is. But I guess I’m starting to realize that without CSS I’m not going to get the result I want… :frowning:

Yeah, this container is not designed to stick in the bottom position, but it can still roll.
I see you don’t use complicated components, maybe you can try making your own with a richtext component with HTML and CSS-inline.