If you’re using the Mobile Header option along with a logo and search icon, you might want to change the layout a bit and place your mobile header logo in the center, and your mobile menu button on the left.
We can do this using a small snippet of CSS:
#mobile-header .site-logo { position: absolute; left: calc( 50% - 90px); /* 50% from the left - half your image width */ } #mobile-header button.menu-toggle { position: absolute; left: 0; }
The only part you need to tweak is the 90px. Adjust that value to exactly half the width of your mobile header logo.