Mobile Logo issue

Home Forums IT Consultant Support Mobile Logo issue

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #84833
    Matt Phillips
    Member
    • Topics: 4
    • Replies: 4
    • Total: 8
    Member since: May 26, 2017

    On mobile my logo is cut off a little. Im using it consultant.
    I added custom css and its not making any difference. franpower.com

    @media screen and (max-width:767px) {
    .header .header-inner .logo{width:100%;}
    }

    #84835
    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 23517
    • Total: 23517
    Member since: August 16, 2013

    Hi,

    Kindly go to Appearance >> Theme Options >> Basic Settings >> Custom CSS Box:

    Add this code there:

    @media screen and (max-width:767px) {
    .header #logo img { max-width:100% !important; height:auto !important;}
    }

    Regards,
    Chris

    #84838
    Matt Phillips
    Member
    • Topics: 4
    • Replies: 4
    • Total: 8
    Member since: May 26, 2017

    got it, It worked.
    Id like to remove the ‘menu’ from the mobile version.

    #84840
    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 23517
    • Total: 23517
    Member since: August 16, 2013

    Hi,

    Kindly go to Appearance >> Theme Options >> Basic Settings >> Custom CSS Box:

    Add this code there:

    @media screen and (max-width:767px) {
    .header_right nav, .mobile_nav a { display:none !important;}
    }

    Regards,
    Chris

    #84844
    Matt Phillips
    Member
    • Topics: 4
    • Replies: 4
    • Total: 8
    Member since: May 26, 2017

    This removed the menu, however the logo is back to the original (too wide)

    #84846
    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 23517
    • Total: 23517
    Member since: August 16, 2013

    Hi,

    Kindly go to Appearance >> Theme Options >> Basic Settings >> Custom CSS Box:

    Add this code there:

    @media screen and (max-width:479px) {
    .header #logo img { max-width:100% !important; height:auto !important;}
    }

    Regards,
    Chris

    #84848
    Matt Phillips
    Member
    • Topics: 4
    • Replies: 4
    • Total: 8
    Member since: May 26, 2017

    Hi,
    I paste this together and separate. Its either the logo works or the menu is removed, not both. Can you paste exactly what I should add to the CSS Box in its entirety to resize logo and remove menu from mobile.

    @media screen and (max-width:767px) {
    .header_right nav, .mobile_nav a { display:none !important;}
    }
    @media screen and (max-width:479px) {
    .header #logo img { max-width:100% !important; height:auto !important;}
    }

    #84885
    Forum Moderator
    Participant
    • Topics: 0
    • Replies: 23517
    • Total: 23517
    Member since: August 16, 2013

    Hi,

    Kindly paste both css in custom css box.

    For hide menu

    @media screen and (max-width:767px) {
    .header_right nav, .mobile_nav a { display:none !important;}
    }

    For logo resizing

    @media screen and (max-width:479px) {
    .header #logo img { max-width:100% !important; height:auto !important;}
    }

    Regards,
    Chris

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.