Combining a navbar and a sidebar

[JosephNoCode]

Hello there ! I require a little bit of help,

I want to create an app that combines, both a sidebar and a navbar like shown in the picture below:

I’m using the new responsive beta update:
To get this result, I put my page in layout : ROW
And both the block the serves me a sidebar and the one for the navbar as Align To Parent.
Well, now it works well, but I would like to put a group on the rest of the page (what’s yellow on the picture up there), so that I could add elements later.

But, the disposition doesn’t let me do this:
the block stacks before or after the navbar as shown in this picture in black:

Has anyone got any idea ?
Thanks a lot, and have a great day !

[twkrk]

Have you tried FloatingGroup element? You can put both navbar and sidebar as FloatingGroup as it will stay on place all the time.

[rpetribu]

I made a very simple setup for you

Link to the editor here.

[JosephNoCode]

I am using the new bubble responsive Engine,
if I put those 2 blocks in floating groups then the block below will be covered by those 2.

I’m trying to make my app the most responsive I can
I’ve used a block for the static navbar while the screen is over 768 px
and used a floating group that covers 70% of the screen when the width is below.
As it is done in the gmail mobile app for example.
I had issues with a floating group not taking the full height of the page
I’ve used a trick by adding a CSS style the body of the page, and a overflow hidden which makes the page impossible to scroll while the floating sidebar is opened in small screens.

Dealing with floating groups makes everything so much more complicated, I’m still a begginner.
If you don’t see quite well what I’m telling you, I can use videos or pictures of course !
Thanks again for your answer

[JosephNoCode]

Thanks a lot ! That seems like the answer I was searching for, it even seems much more simple that what I’ve done