Update 3: Solution worked when changing index width to mobile width. Unfortunately resizing back to 980px did put me back to same issue. I have something in my mind to try out. Is that’s not helping, external help would be nice.
Update 2: Solution with shape as a spacer (link below) worked like a charm!
Update 1: I will first try the solution provided here: Responsive Header issue: Trying to get this to work
Hi there,
I started to create some core elements on my page. But I can’t get responsiveness to work, regarding the menu-toggle icon.
Desktop
This works as expected.
Floating Group is full width of the page (blue). In here I put a group (fixed width) this contains Logo and App name. After that I positioned the bar icon (fixed width, Fixed left Margin).
Mobile
But on Mobile view I want that the bar icon will be positioned at the right of the screen (maintaining the current fixed position on desktop view. But I get this:
Also when I manage to align the bar icon at the right of the mobile screen (by placing it in the group element (logo + appname) like this:
The bar icon on desktop view is moved further to the right (almost) middle of the screen.
Can someone point me in the right direction to get this result on desktop?
And at the same time this result on Mobile?
Thanks