How to change the placement of elements based on screen size?

Need help Responsiveness
1

Hello,

I’ve built a floating sidebar that is meant to be a menu of sorts. I have a few elements within the floating sidebar. When viewing the website on a laptop with a 14 inch screen, the icons are positioned as intended. But when I move the window over to a monitor that is like 24 inches, the elements appear higher up on the page than they should.

My question is how to I keep the elements within the floatinggroup in the same “placement” regardless of the size of the screen it is being viewed on?

Here are some screenshots of what I mean.

floatinggroup 14 inch screen
floatinggroup 14 inch screen791×893 36 KB

floatinggroup 24 inch screen
floatinggroup 24 inch screen1068×925 80.5 KB

Thank you,

2

Make the floating group and the elements in it ‘fixed width’.
Actually just making the floating group ‘fixed width’ should do the trick.

Additionally, you could go through the alignment settings of your elements in the ‘responsiveness’ section to make sure they behave as required when the screen width is increased (left/center/right aligned wrt parent group).

3

Thanks for replying.

Unfortunately that did not seem to work. I’ll play around with some stuff in the morning.

I greatly appreciate the response.