Showing results for 
Search instead for 
Did you mean: 
Frequent Visitor

Applying an expanding menu to responsive containers

Hi! I'm trying to apply a hamburger icon which upon clicking it, an expanding menu will display (this is all within a component). How can I apply it to a responsive layout, of which I have a horizontal container? At the top pf the screen is a header component, and I want to place the the menu component at the top left on top of the header component, but of course it pushes everything else out of the way. Is it possible to get this working in a responsive layout, where the menu will overlay the other containers?  Thank you in advance for any help!

New Member

Hi. I am trying to do this as well. If I place the burger menu in the top left corner of the header container, it does not show when expanded. As the OP asked, is there a way to make it overlay the main container?






Frequent Visitor

Hi seedat, I have got this to work now - you need to put the burger menu outside of the container, just above it in the tree view.  🙂

Hi mcAbri. Thanks. I have done the same but was hoping there is a way to keep it in the header container. Looks like there isn't.

Frequent Visitor

I was hoping the same as it would make far better best practice 🙂

Helpful resources

Microsoft 365 Conference – December 6-8, 2022

Microsoft 365 Conference – December 6-8, 2022

Join us in Las Vegas to experience community, incredible learning opportunities, and connections that will help grow skills, know-how, and more.

Top Solution Authors
Top Kudoed Authors
Users online (4,064)