Just turn on the Contain within Body setting in TopBar. This will limit the contents to your site width.
What you have done is add margins to the generic stacks settings at the top. This will just affect the stacks wrapper divs`. When the TopBar div itself fixes it will no longer be inside these wrappers and so you loose the margins.
I found a margin I forgotten about and reset it but the logo shifted over now. I think the Contain Body Within setting put the Topbar to the Site Width setting.
i wanted it to be in the Full Width setting but with a bit of margin on the right and left to prevent the content being pressed against the edge. [quote=“zeebe, post:4, topic:18308, full:true”]
Not sure about anyone else, but when TopBar sticks, the button stays where it is at for me:
Looks like your padding has pushed the contents out of the bar for the mobile menu.
You may find it easier to put your Topbar inside a Chroma if you want more control. Set the TopBar to static and fix it with Chroma. You can either use Chroma’s padding controls or even put TopBar inside a padded column or even a BluePrint ONE if you need exact control.
Let Chroma apply the background colur and your bar will sit inside whatever padding you apply for various device sizes.