Archived topic
Mobile Menu issue
5 replies · Started by Rohan Verma on August 14, 2020
I have used the centering site logo in mobile css code from the documentation. It works good. But the sub-menu item seems breaking the layout. Just tap/click on the menu icon on mobile version and help me on it.
I’m using below code:
#mobile-header .site-logo {
position: absolute;
left: calc( 50% – 110px); /* 50% from the left – half your image width */
}
#mobile-header button.menu-toggle {
position: absolute;
left: 0;
}
Hi there,
Try changing your menu toggle CSS to this:
#mobile-header button.menu-toggle {
position: absolute;
top: 0;
left: 0;
}I'm talking about this issue. Take a look.
The issue is happening for this code.
#mobile-header .site-logo {
position: absolute;
left: calc( 50% – 110px); /* 50% from the left – half your image width */
}
Change that code to this:
#mobile-header .site-logo {
position: absolute;
left: calc(50% - 110px);
top: 0;
}Thanks. Solved.
You're welcome
