Group Focus goes off screen?

On mobile my group focus within my repeating groups will go off screen for certain elements. Is there anyway to keep a group focus always on screen?
Offsetting it based on screen width doesn’t really work here I don’t think as the RG goes from left to right and so one side need a certain offset different to the other.

Any ideas?

Have you figure out this?

Would really want to know how to deal with this same issue!


Give your parent an HTML id and pass this code into HTML element.

#mainContent {

and see if it working or not.

Let me know someone if this works, whereas now i use workflow “if this condition is true” and setting up when (in my case) a popup is visible, to hide the FocusGroup.

Try adding this to either your app (Settings > Script in the Body) or the page (click the page in Elements Tree > Page HTML Header)

@media all and (max-width: 767px) {
 .GroupFocus {
    width: 95% !important; /*Or whatever % you want*/
    max-width: unset !important;
    left: 2.5% !important; /*This is just 100% minus width (above) divided by 2 to make it centered*/

So instead of this on mobile:
Screen Shot 2022-06-06 at 2.20.27 PM

It should be centered like this:
Screen Shot 2022-06-06 at 2.19.41 PM

If you just want it for a specific Group Focus, give the element an ID, and use #theElementIdYouUsed instead of .GroupFocus in the CSS above.

Hopefully that’s helpful!


Thank you so much! Super helpful - and it worked!

1 Like

You’re welcome!