css - Wordpress: Problems with custom-logo & menu/sidebar-toggle -


i'm new wordpress , using skilt-theme new blog. i'm having problems custom-logo , sidebar-toggle.

without logo: click

with logo: click

as can see: sidebar-toggle moving down when uploading custom-logo. nice have whole menu @ same place before uploading logo. hope you'll find way fix it.

css:

.site-header {  position: relative;  z-index: 100;  padding: 30px 0;  padding:  3rem 0;  }  .site-header {  color: inherit;  }   .site-title {     line-height: 1;   margin: 0;   }   .site-description {   margin: 0;   }    @media screen , (min-width: 480px) {   .site-title,   .site-description {    display: inline-block;    vertical-align: middle;    }    .custom-logo {    display: inline-block !important;    vertical-align: middle;    }    .site-description {    margin: 0 0 0 10px;    }   }   .site-branding {   float: left;   }   .site-navigation-toggle {   color: #252931;   right: 0;   line-height: 1;   z-index: 9000;   font-size: 30px;   font-size: 3rem;   -moz-transition: opacity 150ms;   -o-transition: opacity 150ms;   -webkit-transition: opacity 150ms;   transition: opacity 150ms;   }    .site-navigation-toggle .fa-bars {    position: relative;    top: -3px;    max-height: 25px;    display: inline-block;    overflow: hidden;   }     .custom-logo {    display: block;    max-width: 100%;    background-repeat: no-repeat;    background-size: contain;    background-position: center center;    }    .custom-logo {    display: block;    width: 100%;    height: 0;    font: 0/0 a;    text-decoration: none;    text-shadow: none;    color: transparent;    }    .site-main {    display: block;    }   .single .site-main, .page .site-main {    background-color: #fff;    padding: 30px;    padding: 3rem;    }   .has-background .site-header,  .has-background .site-footer,  .has-background .social-links,  .has-background .paging-navigation,  .has-background .site-title {   color: #fff;   } 

and header-code:

        <div class="site-branding">             <?php if ( stag_get_logo()->has_logo() ) : ?>                 <div class="custom-logo">                 <a rel="home" title="<?php esc_attr_e( 'home', 'stag' ); ?>" href="<?php echo esc_url( home_url('/') ); ?>"></a>                 </div>             <?php else: ?>                 <h1 class="site-title"><a href="<?php echo esc_url( home_url() ); ?>"><?php bloginfo( 'name' ); ?></a></h1>             <?php endif; ?>              <?php $is_hiding = stag_theme_mod( 'title_tagline', 'hide-tagline' );  ?>             <p class="site-description"<?php if ( $is_hiding ) echo ' hidden'; ?>><?php bloginfo( 'description' ); ?></p>         </div>          <?php stag_maybe_show_primary_menu( 'header' ); ?>          <a href="#" id="site-navigation-toggle" class="site-navigation-toggle"><i class="fa fa-bars"></i></a>      </header 

i have been through site , found easiest solution @ moment.

please remove top css class class .site-navigation-toggle, .menu-header means :

.site-navigation-toggle, .menu-header { position:absolute;top:50%;transform: translatey(-50%);} 

this should this

.site-navigation-toggle, .menu-header { position:absolute;transform: translatey(-50%);} 

just removed top:50% , ok..


Comments

Popular posts from this blog

powershell Start-Process exit code -1073741502 when used with Credential from a windows service environment -

twig - Using Twigbridge in a Laravel 5.1 Package -

c# - LINQ join Entities from HashSet's, Join vs Dictionary vs HashSet performance -