[Resolved] Site Title Not Visible in Mobile

[Navaneetha]

Hai. Site Title Only Visible in Desktop..Its not Visible in Mobile and Tablets

[David]

Hi there,

you have the mobile header option set in Customizer > Layout > Header – go there and you will see a option to add a logo to that, it is designed so you can use a different logo for the smaller screen sizes.

[Navaneetha]

Hai.. I have disabled the Mobile Header. Now the site title is showing in all devices. But in mobile and tablet devices its not aligned in center. I would like to align the menu and site title in center. Can u please help me to align center.

[David]

Do you have any plugin or server caches you can clear as i am not seeing the navigation on mobile or tablet?

[Navaneetha]

its not showing at my end. I have cleared the cache. is there any possibilities to configure my requirements from your end..?

[David]

Hi there,

Autoptimize is for some reason re-ordering the CSS, anyhow we need to apply some CSS to get the layout you want so try adding this:

@media (max-width: 768px) {
    #site-navigation {
        display: block !important;
        opacity: 1;
    }
    .inside-navigation {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
            flex-wrap: wrap;
    }
    button.menu-toggle {
        -webkit-box-flex: 1;
            -ms-flex: 1 0 50%;
                flex: 1 0 50%;
    }
    .inside-navigation .mobile-bar-items {
        position: relative;
        -webkit-box-ordinal-group: 4;
            -ms-flex-order: 3;
                order: 3;
    }
    .site-branding {
        -webkit-box-flex: 1;
            -ms-flex: 1 0 100%;
                flex: 1 0 100%;
        -webkit-box-ordinal-group: 0;
            -ms-flex-order: -1;
                order: -1;
        text-align: center;
    }
    .inside-navigation .main-nav {
        -webkit-box-flex: 1;
            -ms-flex: 1 0 100%;
                flex: 1 0 100%;
        -webkit-box-ordinal-group: 5;
            -ms-flex-order: 4;
                order: 4;
    }
    
}

[Navaneetha]

Its working properly.
Thank you so much

[David]

You’re welcome

[Author]

Posts