Floating group has weird responsive behavior

Hello everyone, I’m experiencing a really weird behavior with floating groups in relation to responsive design.

In short, the floating groups do shrink by browser size appropriately when I decrease its size manually, but when I reload the page on inspect mode (mobile screen size) or actually load the page on a mobile device, the floating group remains larger than the correct screen size.

For instance, here’s the image of an interface I’m working on.

when I shrink the browser size manually, the responsive behavior of the message-input floating group at the bottom of the screen works fine

But when I reload this page, or as mentioned, open the page on mobile, this is what the page looks like. As you can see, the floating group is gone

But when I zoom out, I see this weird thing happening

I don’t understand why this is happening. The UI works fine on tablet screens - phones are the problem. This problem is actually occurring in all of my pages with any floating groups that occupy the bottom of the screen.

I checked into the layout system of my page multiple times but no problem could be discovered.

Any help would greatly be appreciated!

Thank you.

This topic was automatically closed after 70 days. New replies are no longer allowed.