[Support request] Mobile Header: Logo right and mobile menu left not working after update

Home Forums Support [Support request] Mobile Header: Logo right and mobile menu left not working after update

Home Forums Support Mobile Header: Logo right and mobile menu left not working after update

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #527539
    Antonio

    Hi,

    This morning I updated the Gp Premium to the new version 1.6 and suddenly my mobile header lost the style I predefined in CSS (I am using the child theme)

    In CSS I have this:

    .main-navigation.mobile-header-navigation.stuckElement {
    	height: 100px;
    }
    
    .main-navigation.mobile-header-navigation.stuckElement .site-logo {
    	width: auto;
    }
    
    .mobile-header-navigation .mobile-header-logo img {
    	height: 100px !important;
    }
    
    .main-navigation.mobile-header-navigation.stuckElement .site-logo.mobile-header-logo {
    	float: right !important;
    }
    
    .main-navigation.mobile-header-navigation.stuckElement .menu-toggle {
    	float: left !important;
    	font-size: 35px;
    }

    But after the update the logo is on the left and the navigation on the right.

    I need the opposite: Logo right, Mobile Navigation left (Menu Toggle)

    How can I solve this?

    GeneratePress 2.0.2
    GP Premium 1.6
    #528173
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    Since the mobile header is using Flexbox now, we can do this:

    #mobile-header .menu-toggle {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1;
        margin-right: auto;
    }
    
    #mobile-header .site-logo {
        -webkit-box-ordinal-group: 4;
        -ms-flex-order: 3;
        order: 3;
        margin-right: 0;
    }
Viewing 2 posts - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.