Scrolling form with bottom container

1

I have a long scrolling form. At the bottom of the screen, regardless of the what part of the form is shown, i need to have a container with buttons i.e. the container is always visible at the bottom of the user’s screen as the user scrolls up and down the form.

Is there a way to do this?

Thanks

2

Try, in property class of the container: fixed-bottom

3

You didn’t mention, but @bsommer’s answer makes sense if you’re using Bootstrap.

If you would like to see all the classes which can be used with Bootstrap 4, here is a handy cheatsheet:

4

Thanks for your replies.

I am mainly using Bootstrap 4. Which property do you have to set it to?
I couldn’t get it to work.

Thanks.

5

‘’’

<div=container>
<div=scroll-area>

<div=footer-with-buttons>

‘’’

Then apply the fixed position .css to the footer.

6

Thanks.

I ended up using below:

#Container1 {
position: fixed;
top: calc(100% - 50px);
height: 40px;
z-index: 999;
background-color: red;
color: white;
font-size: 18px;
}

7

I entered the fixed-bottom class with project properties where the BS4 container, which should stay at the bottom, was selected. Just after “class” type: fixed-bottom.

Thanks for your code snippet. “calc(100% - 50px)” is an excellent solution I had not thought of in places where I could have needed it and still could use it.