How can keep the floating group inside the page

I am using floating groups to create a bottom navigation bar for my mobile app. this works perfectly in the development see figure 1, yet when i preview my work the floating group shows up outside of the actual screen see figure 2.
what can i do to fix this?
I tried changing the horizontal float option to the right but that just moved the problem to the right.

I have made the main screen red so the problem can be visible.
figure 1:

figure 2:

The floating group is doing what it is designed to do. It is floating to the left.

Try setting it to be a row with no max width and put your icons inside a group that is placed inside the floating group. Center this group and make it make it max width 320px (this is the original iPhone’s width which is the smallest one out of the bunch).

This should do the trick :wink:

1 Like