Center a Group Focus Group attached to a floating group

Need help
1

Hi.

I’m building a web app that has a floating group that is floating relative to the bottom. It’s width expands to fill any size of page so that the text in it is always centered.

I’ve attached a group focus to this and I’m not able to have it remain in the center relative to the group focus. I’m wondering if CSS will be the way to go for this…

2

@enyarick
Why do you want to attach a group focus to a floating Group ? That’s sound weird ?!

3

Well, the application is an order page where any time there’s a cart item in the cart a floating group appears with some information on the cart. When the user clicks the floating group a group focus pops up and provides more details and options.

Works great on a mobile screen with precise offset, but the same offset will not work with a larger screen.

1 Like
4

Are you using the new or legacy layout engine?

5

New Responsive Engine.

6

Have you thought about a hidden element inside the floating group that is centered and attaching group focus to that element with offsets set correctly of course

7

Hadn’t thought about this option. Let me try this.

8

Tried this. Still not working. The hidden element is not staying reliably centered. So I’m either getting it to work when on a small screen or on a bigger screen.

Changes I made were

  1. Put the group focus in a reusable floating group.
  2. Added an element that was centered horizontally in the floating group 1px by 1px
  3. Made the group focus relative to this centered group (offset by half it’s width)

Only visible on a mobile screen. On a PC screen it doesn’t show up.

9

Hi Enyarick,
I just created a page to test my idea, and if i am understanding you correctly the group focus doesnt show up on PC?

It works on my test page and remains centered when i resize its width.

I made the floating group full page width and transparent and always visible, then added the 1mm x 1mm cntred piece and did as you did with the offset by half. the only other thing i did was a workflow to display the group focus, something to trigger it appearing.

10

Sorry. What I mean is I seem to be able to have the group focus show up correctly either on a mobile screen or on a pc…not able to crack both. Would you be able to share the builder for your test?

11

I’ve discovered where I was going wrong. There was a mismatch on the width of the floating group vs everything else making the group focus not work correctly.

Thank you so much!

1 Like
12

Perseverance is the key sometimes, others times you just need to take a rest

1 Like
13

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