# Floating group is stuck on left side of the screen **URL:** \ **Category:** Responsiveness\ **Created:** [September 12, 2019, 8:40am UTC](https://forum.bubble.io/t/floating-group-is-stuck-on-left-side-of-the-screen/66694 "2019-09-12T08:40:48Z")\ **Posts on this page:** 7\ **Page:** 1
**Author:** ![jamesdaly](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/jamesdaly/32/39301_2.png) [@jamesdaly](https://forum.bubble.io/u/jamesdaly)\ **Post date:** [September 12, 2019, 8:40am UTC](https://forum.bubble.io/t/floating-group-is-stuck-on-left-side-of-the-screen/66694/1 "2019-09-12T08:40:48Z")
Here’s what I’m wanting to do (finished app working on desktop view): A sticky left navigation, similar to the new Twitter redesign. I’ve done this using a Floating Group. ![proper-positioning-v2-compressor](https://us1.discourse-cdn.com/bubble/original/3X/7/c/7c2241936557f4719374e0e72ec8039bc6d48cd4.gif) However, as soon as I try and make this responsive (eg turn off Fixed Width for this page), all hell breaks loose, and the group is stuck to the left edge of the window. ![56%20pm](https://us1.discourse-cdn.com/bubble/original/3X/d/3/d322525f908858a087dfa8547b605b801fe8f293.jpeg) ![25%20pm](https://us1.discourse-cdn.com/bubble/original/3X/b/9/b9e9b520678f4af6e9ec6114887216671b4b0617.png) I would fix this by grouping all elements on this page and adjusting from there, however a Floating Group can’t be grouped with anything else, so it’s kinda just off on its own, all lonely on the edge there. I’ve watched all the tutorials I can find on Bubble responsiveness, but am still at a loss once a Floating Group/position: sticky is thrown into the mix. How do I make this behave? Link: [Findyourbuilder | Bubble Editor](https://bubble.io/page?type=page&name=admin-controls&id=findyourbuilder) Thanks in advance! ---
**Author:** ![paritosh.mehta19](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/paritosh.mehta19/32/110875_2.png) [@paritosh.mehta19](https://forum.bubble.io/u/paritosh.mehta19)\ **Post date:** [September 12, 2019, 9:27am UTC](https://forum.bubble.io/t/floating-group-is-stuck-on-left-side-of-the-screen/66694/2 "2019-09-12T09:27:54Z")
I am not sure if this approach would work on a Reusable element, but I had managed to setup this on a page directly. Here’s a post explaining my steps. > [@Horizontal alignment and responsive settings for floating groups](http://forum.bubble.io/t/horizontal-alignment-and-responsive-settings-for-floating-groups/22245/8): > > Hi @sridharan.s, Here you go. The settings I have done are as follows: Floating Group (2 screenshots - couldn’t take a complete screeshot due to the screen resolution): [FG1] Then I have created a group inside the FG. Make note, that under the responsive tab, I have set the group as center alignment. [G1] You can then have any element in this group: Again have that center aligned. Hope this helps. In case you need anything more, let me know. Cheers, Paritosh Hopefully that helps. Unfortunately, I have updated my app to not include this behaviour any more, so I don’t have a live link that I can share. ---
**Author:** ![duke.severn](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/duke.severn/32/38191_2.png) [@duke.severn](https://forum.bubble.io/u/duke.severn)\ **Post date:** [September 12, 2019, 10:09am UTC](https://forum.bubble.io/t/floating-group-is-stuck-on-left-side-of-the-screen/66694/3 "2019-09-12T10:09:46Z")
> [@jamesdaly](#): > > How do I make this behave? FLs are tough to deal with responsively because they have no concept of what’s going with other elements. If I have to, I usually link them to a page-level element (bumper). > **[Bubble Editor - Duke-ssandbox](https://bubble.io/page?type=page&name=index&id=duke-ssandbox&tab=tabs-1)** > > Build stuff without code and launch a startup without a tech-cofounder! Bubble is a visual programing language. Instead of typing code, use a visual editor to build applications. If you can make a bumper at the page level behave, you can id it “bump”, id your REU as fl\_left and use this code: ```auto $(window).resize(function(){ s = $('#bump').parent().position(); $('#fl_left').css('left' , s.left + 'px'); }); ``` Don’t forget to run the inside of the function on page load. Depending on your setup you might have to use `.closest()` to find the first r-box. ---
**Author:** ![jamesdaly](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/jamesdaly/32/39301_2.png) [@jamesdaly](https://forum.bubble.io/u/jamesdaly)\ **Post date:** [September 13, 2019, 1:04am UTC](https://forum.bubble.io/t/floating-group-is-stuck-on-left-side-of-the-screen/66694/4 "2019-09-13T01:04:39Z")
@duke.severn You genius!! This is EXACTLY what I’m looking for, THANK YOU! Okay, I have almost everything set up, JavaScript is in, IDs are in, bumper is behaving, but still no action. Am I missing something in the function? I have a hunch there might have been a key missing word in your instructions at: “Don’t forget to run the inside of the function on page load.” This is my setup: [https://bubble.io/page?type=page&name=admin-controls&id=findyourbuilder&tab=tabs-1](https://bubble.io/page?type=page&name=admin-controls&id=findyourbuilder&tab=tabs-1) I’d owe you if you had a free moment to check out what last step I’m missing 😇🙏 Thank you! ---
**Author:** ![duke.severn](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/duke.severn/32/38191_2.png) [@duke.severn](https://forum.bubble.io/u/duke.severn)\ **Post date:** [September 13, 2019, 7:46pm UTC](https://forum.bubble.io/t/floating-group-is-stuck-on-left-side-of-the-screen/66694/5 "2019-09-13T19:46:18Z")
The window.resize() goes in your html headers or html element inside `` tags. The inside function to run on page load is just this: ```auto s = $('#bump').parent().position(); $('#fl_left').css('left' , s.left + 'px') ``` See provided example: page load function, html A (I think). ---
**Author:** ![jamesdaly](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/jamesdaly/32/39301_2.png) [@jamesdaly](https://forum.bubble.io/u/jamesdaly)\ **Post date:** [September 14, 2019, 8:47am UTC](https://forum.bubble.io/t/floating-group-is-stuck-on-left-side-of-the-screen/66694/6 "2019-09-14T08:47:51Z")
Perfect, that’s done it! THANK YOU! I can’t thank you enough for solving this so completely for me, you’ve saved me days of frustration. I owe you a drink if you’re ever in Sydney! ---
**Author:** ![duke.severn](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/duke.severn/32/38191_2.png) [@duke.severn](https://forum.bubble.io/u/duke.severn)\ **Post date:** [September 14, 2019, 6:41pm UTC](https://forum.bubble.io/t/floating-group-is-stuck-on-left-side-of-the-screen/66694/7 "2019-09-14T18:41:27Z")
Glad I could help.