How to ensure that the footer is always at the bottom for all mobile devices?

Hi,

I am building a single page mobile app. I have a menu at the footer. I would like menu to show up at the bottom for all mobile devices. I noticed that sometimes it is cut off or does not show up depending of the screen size.

Is there a way to adjust the footer so that it always shows up properly regardless of the mobile devices? For instance, adjust vertical offset depending of the mobile screen height. Is something like that is possible?

I am using a floating group by the way.

Thanks in advance

FG is the way to go. Create a transparent FG, float it from the left and bottom, and put the actual group inside the FG. Responsive-center the group inside the FG. One critical thing to note is that the bottom of the FG, the bottom of the inner group, and the bottom of the page must be aligned exactly. Another thing is the height of elements. If things get cut off or don’t show, either your elements are taller than the group, or there is some misalignment of the bottom edge.

To diagnose your problem, please share your editor in read-only.

2 Likes

The answer is for sure usuing a floating group.
By the way, I’m also creating a mobile app. What are you creating everything in a single page? Is It because of speed or something. I use different pages for every section of the app menu, but I’m afraid it can make the app slower.