Mobile view issue: Site Logo and Menu should be in one line


Please see the screenshot first. The site and menu are centered and killing so much space. I want them to be looked like this: Site logo on the left and menu on the right. Both are on one line. Please advice.


Hi there,

You may want to try this tricks below. Add this CSS code to Customize > Additional CSS:

@media only screen and (max-width: 1024px){
    .site-header .site-branding, .site-header .btn-menu {
        width: 50%;
    .site-header .site-branding {
        text-align: left;
    .site-header .btn-menu {
        text-align: right;

Thank you, Awan! It works :slight_smile:

1 Like