我的網站頁眉圖像不調整大小在移動

Question

我使用博客，有我說，它工作正常頭的自定義模板，但頭不調整移動模板 我的網站是https://untoldstoriesofpakistan.blogspot.com

我認爲這是我的CSS的頭

頭

div#navigation-wrapper { 
width: 56%; 
float: right; 
} 
#header { 
width: 30%; 
background-size: contain; 
} 
#logo { 
text-align:center; 
padding:0px 0; 
height: 10px; 
background-size: contain; 
} 

，這是我的媒體的CSS

@media only screen and (max-width: 767px) { 

    .container { 
     width:300px; 
    } 

    #navigation-wrapper { 
     display:none; 
    } 

    .slicknav_menu { 
     display:block; 
    } 

    #logo img { 
     max-width:300px; 
     height:auto; 
    } 

    .post-header h1 a, .post-header h2 a, .post-header h1 { 
     font-size:22px; 
     letter-spacing:2px; 
    } 

    .post-image img { 
     width:300px; 
     height:auto; 
    } 

    .post-image.audio iframe { 
     width:300px; 
     height:auto; 
    } 

    .item-related { 
     width:320px; 
     margin-bottom:30px; 
    } 

    .share-box { 
     width:46px; 
     height:36px; 
     line-height:36px; 
     margin:0 4px; 
    } 

    .post-pagination .prev-post { 
     width:300px; 
    } 
    .post-pagination .next-post { 
     width:300px; 
    } 

    #respond textarea { 
     width:90%; 
    } 

    .thecomment .author-img { 
     display:none; 
    } 

    #widget-area .widget, #sidebar .widget { 
     width:300px; 
     margin-right:32px; 
     float:left; 
     margin-bottom:35px; 
    } 

    #footer-logo img { 
     max-width:300px; 
     height:auto; 
    } 

    #footer-social a i { 
     height:28px; 
     width:28px; 
     line-height:28px; 
     margin-right:0; 
     font-size:12px; 
    } 
    #footer-social a { 
     margin:0 5px; 
    } 
    #footer-social a span{ 
     display:none; 
    } 

    .wpcf7 textarea { 
     width:94%; 
    } 

    .sp-grid li { 
     width:320px; 
    } 
    .sp-grid li:nth-child(3n+3) { 
     margin-right:0; 
    } 
    .sp-grid li:nth-child(2n+2) { 
     margin-right:0; 
    } 

    .container.sp_sidebar #main { 
     width:300px; 
     margin-right:0; 
    } 
    .container.sp_sidebar #sidebar { 
     width:300px; 
    } 

     .container.sp_sidebar #sidebar .widget { 
      width:300px; 
     } 

    .container.sp_sidebar .item-related { 
     width:300px; 
     margin-bottom:30px; 
    } 


    .col-md-6.site-top-menu-right.text-right { 
    display: none; 
    } 





    div#sidebar-narrow { 
    display: none; 
    } 

    div#main-part { 
    float: left; 
    width: 310px; 
    } 

    } 

Answer 1

您需要更改標題圖像大小。搜索你的代碼爲

@media only screen and (max-width: 767px) and (min-width: 480px){ 
    #logo img { 
    max-width: 480px; 
     height: auto; 
    } 
    } 

@media only screen and (max-width: 767px) { 
    #logo img { 
     max-width: 300px; 
     height: auto; 
    } 
    } 

img#Header1_headerimg { 
     width: 180px; 
     height: 55px; 
     float: left; 
} 

與

img#Header1_headerimg { 
    width: auto; 
    height: 50px; 
    float: left; 
} 

Answer 2

變化的CSS代碼這一個替代它：

#logo img { 
    max-width: 10em; 
    height: auto; 
}