WordPress的：自定義徽標和菜單/側邊欄切換問題

Question

我是新來的Wordpress和使用Skilt主題爲我的新博客。現在我遇到了自定義徽標和側欄切換的問題。

無商標： Click

隨着標誌： Click

正如你可以看到：上傳自定義徽標時，側邊欄，切換向下移動。如果將整個菜單放在與上載徽標之前相同的位置，那將會很不錯。希望你會找到解決的辦法。

CSS：

.site-header { 
position: relative; 
z-index: 100; 
padding: 30px 0; 
padding: 3rem 0; 
} 

.site-header a { 
color: inherit; 
} 

.site-title { 
    line-height: 1; 
    margin: 0; 
    } 

.site-description { 
    margin: 0; 
    } 

    @media screen and (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 a { 
    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; 
    } 

和頭部代碼：

 <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 

Answer 1

我已經通過您的網站，發現在這一刻你最簡單的解決方案。

請從你的類該類.site導航撥動刪除此之上的CSS，。菜單頭是指：

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

這應該是這樣的

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

只是刪除頂： 50％，一切都將是確定..