# Groups/Buttons moving about

**URL:** <https://forum.adalo.com/t/groups-buttons-moving-about/6074>\
**Category:** Get Help\
**Created:** [November 17, 2020, 6:18pm UTC](https://forum.adalo.com/t/groups-buttons-moving-about/6074 "2020-11-17T18:18:16Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![NigelG](https://avatars.discourse-cdn.com/v4/letter/n/ea5d25/32.png) [@NigelG](https://forum.adalo.com/u/NigelG)\
**Post date:** [November 17, 2020, 6:18pm UTC](https://forum.adalo.com/t/groups-buttons-moving-about/6074/1 "2020-11-17T18:18:16Z")

</div>

Not being a UI person, I am struggling a little to understand where I should be looking to understand why my buttons (which are in a group so I can hide them both when needed) are moving up when on a mobile. The keyboard would ideally overlay these, but it squidges it all up at the top.

 ![image](https://us1.discourse-cdn.com/flex020/uploads/adalo/original/2X/6/62cb19c7a768723f2f573001ccc3b1e89b656389.png)

---

<div class="post-metadata">

**Author:** ![Michael](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.adalo.com/michael/32/3120_2.png) [@Michael](https://forum.adalo.com/u/Michael)\
**Post date:** [November 18, 2020, 2:50pm UTC](https://forum.adalo.com/t/groups-buttons-moving-about/6074/2 "2020-11-18T14:50:58Z")

</div>

I recommend putting a rectangle around things if you are having trouble keeping the items where you want them.

Make it all one group inside of the rectangle.

---

<div class="post-metadata">

**Author:** ![NigelG](https://avatars.discourse-cdn.com/v4/letter/n/ea5d25/32.png) [@NigelG](https://forum.adalo.com/u/NigelG)\
**Post date:** [November 19, 2020, 7:19am UTC](https://forum.adalo.com/t/groups-buttons-moving-about/6074/3 "2020-11-19T07:19:23Z")

</div>

Thanks.

This is not something I have got to grips with yet. Buttons seem to expand to take up space if another button is hidden.

From what I have read, an element tries to keep a relationship with other elements …

So in here …

![image](https://us1.discourse-cdn.com/flex020/uploads/adalo/original/2X/0/0cb21284b99416f01b1871d7bf48710712a0d2e7.png)

If I hide “Check” the “Clear” becomes larger and I can’t see how to stop that.

Which is why the two buttons below are like they are.

But when “Redeem” is hidden “Cancel” moves up. Not really sure what it is anchoring itself to, maybe the “Amount” input ?

Not the most pressing of issues. But it would be better UX if buttons didn’t move.

---

<div class="post-metadata">

**Author:** ![Michael](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.adalo.com/michael/32/3120_2.png) [@Michael](https://forum.adalo.com/u/Michael)\
**Post date:** [November 19, 2020, 8:50am UTC](https://forum.adalo.com/t/groups-buttons-moving-about/6074/4 "2020-11-19T08:50:02Z")

</div>

Yes the buttons will move in relation to each other. However if you place them both in their own individual box, the space should be preserved.

This can take a little playing around to get it to function correctly. Occasionally I have had to place empty boxes next to something (to act as a spacer) in order to keep something in place.

Either way, you should be able to get the result you are looking for just by playing around with it a little.

---

<div class="post-metadata">

**Author:** ![NigelG](https://avatars.discourse-cdn.com/v4/letter/n/ea5d25/32.png) [@NigelG](https://forum.adalo.com/u/NigelG)\
**Post date:** [November 19, 2020, 8:53am UTC](https://forum.adalo.com/t/groups-buttons-moving-about/6074/5 "2020-11-19T08:53:01Z")

</div>

Thanks. I put them in group, so will try putting them in rectangle.

The moving up when the keyboard appeared was solved by aligning the group to the bottom so that was the major issue.

---

<div class="post-metadata">

**Author:** ![Erik](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.adalo.com/erik/32/7849_2.png) [@Erik](https://forum.adalo.com/u/Erik)\
**Post date:** [November 19, 2020, 12:13pm UTC](https://forum.adalo.com/t/groups-buttons-moving-about/6074/6 "2020-11-19T12:13:33Z")

</div>

You may find this tutorial for another program useful - [https://twitter.com/nocodelife/status/1320825083213041664](https://twitter.com/nocodelife/status/1320825083213041664). He explains how to use rectangles and grouping, which is similar to how Adalo works.

---

<div class="post-metadata">

**Author:** ![NigelG](https://avatars.discourse-cdn.com/v4/letter/n/ea5d25/32.png) [@NigelG](https://forum.adalo.com/u/NigelG)\
**Post date:** [November 20, 2020, 10:20am UTC](https://forum.adalo.com/t/groups-buttons-moving-about/6074/7 "2020-11-20T10:20:15Z")

</div>

Thanks. I am all too familiar with putting little rectangles on Bubble pages to stop things from moving about 🙂

---

<div class="post-metadata">

**Author:** ![system](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.adalo.com/system/32/40401_2.png) [@system](https://forum.adalo.com/u/system)\
**Post date:** [November 30, 2020, 10:20am UTC](https://forum.adalo.com/t/groups-buttons-moving-about/6074/8 "2020-11-30T10:20:22Z")

</div>

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.
