Okay
  Public Ticket #335601
logo on mobile too small
Closed

Comments

  • Jason started the conversation
    December 15, 2014 at 3:23am

    I have tried this, but it doesn't work.

    @media only screen and (min-width : 1px) and (max-width : 1000px) { body header#top #logo img { height: 27px !important; } #header-outer { height: 73px !important; } }

    HELP! logo on mobile is too small.

  •  8,847
    Tahir replied
    December 15, 2014 at 5:10pm

    Hey!

    Can you provide the page url so i can take a look at why the css is not working. 

    Thanks

    ThemeNectar Support Team 

  • Jason replied
    December 16, 2014 at 7:18am

    Hi Tahir... it is www.jsnco.com/KT

  • Jason replied
    December 16, 2014 at 7:24am

    I also added this:

    /* Desktop greater then 1000px */

    @media only screen

    and (min-width : 1000px) {

    body header#top #logo img {

    height: 50px!important;

    margin-top: -8px !important;

    }

    }

    /* Desktop */

    @media only screen

    and (min-width : 1px) and (max-width : 1000px) {

    body header#top #logo img {

    height: 37px!important;

    margin-top: -6px !important;

    }

    }

    /* iPad */

    @media only screen and (min-device-width: 481px) and (max-device-width: 1025px) {

    body header#top #logo img {

    height: 54px!important;

    margin-top: -12px;

    }

    }

    /* iPad landscape */

    @media only screen and (min-device-width: 481px) and (max-device-width: 1025px) and (orientation:landscape) {

    body header#top #logo img {

    height: 54px!important;

    margin-top: -12px !important;

    }

    }

    /* Mobile */

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

    body header#top #logo img {

    height: 54px!important;

    margin-top: -12px;

    }

    }

    Does not work as well.

  •  8,847
    Tahir replied
    December 17, 2014 at 3:31pm

    Hey!

    Add this into the Custom CSS box located in your Salient Options panel :
    @media only screen and (max-width : 1000px) {
    
    html body header#top #logo img {
        
        height: 50px!important;
        
        margin-top: -16px !important;
    
    }


}
@media only screen and (min-width : 1000px) {
    
    html body header#top #logo img {
        
        height: 115px!important;
        
        margin-top: -8px !important;
    
    }


}
    Thanks 

    ThemeNectar Support Team 

  • Jason replied
    December 23, 2014 at 5:47am

    Thank you so much! Great support! Thumbs up!