Tagged: , ,

Viewing 21 posts - 1 through 21 (of 21 total)
  • Author
    Posts
  • July 5, 2017 at 9:38 pm #816888
    July 6, 2017 at 4:34 am #817012
    Jordan Shannon

    Hey musedesignca,

    The logo seems to be in the top left corner on mobile now. Where you able to get this fixed?

    Best regards,
    Jordan Shannon

    July 6, 2017 at 1:53 pm #817253
    musedesignca

    Im on an iphone and I still cant see a logo.

    July 6, 2017 at 3:34 pm #817295
    Jordan Shannon

    Hi,

    This is how I am viewing the page. Let me know if this is not correct:

    https://snag.gy/kBDLbx.jpg

    Best regards,
    Jordan Shannon

    July 6, 2017 at 4:58 pm #817356
    musedesignca

    Interesting. This is how I see it:
    cabra

    July 6, 2017 at 5:03 pm #817358
    Jordan Shannon

    Hi,

    Please try deactivating all active plugins and check if that helps. Also, try re-uploading the logo and refreshing your cache on mobile.

    Best regards,
    Jordan Shannon

    July 7, 2017 at 4:27 pm #817919
    musedesignca

    I deactivated all plugins and re-uploaded the logo but its still not showing up on any of my iPhones.
    I dont know how to refresh cached on mobile but I quit safari and then tried opening the page again.

    July 7, 2017 at 5:09 pm #817928
    Jordan Shannon

    Hi,

    Try and remove the custom css (be sure to paste/save it elsewhere first!) and see if there is not a css conflict.

    Best regards,
    Jordan Shannon

    July 11, 2017 at 10:26 pm #819659
    musedesignca

    You were right Jordan, something in the custom CSS is in conflict with that mobile logo showing up. I guess I will have to re-add each css block back one at a time to find out which one is making it do that. Thanks!

    July 11, 2017 at 10:31 pm #819661
    musedesignca

    Actually, I found what’s making the logo disappear on mobile.
    Its padding we added to the top of the logo to center it on the desktop site header:

    strong.logo img{
    padding: 40px 0px;
    }

    So if I remove that the logo is stuck right at the top of the browser. How can I fix this for desktop and mobile?

    July 11, 2017 at 10:44 pm #819674
    Jordan Shannon

    Hi,

    So when this is removed it appears on mobile? Can you post a screenshot?
    Best regards,
    Jordan Shannon

    July 12, 2017 at 9:42 pm #820229
    musedesignca

    I changed the padding to 10px and it appears on mobile now but it doesnt look centred vertically on desktop
    Screen shot of mobile is here: https://ibb.co/jv9T5F

    July 13, 2017 at 9:00 am #820397
    John Torvik

    Hi,

    I`ve checked it and all looks normally – could you provide some screenshot with this problem?

    Best regards,
    John Torvik

    July 13, 2017 at 4:24 pm #820629
    musedesignca

    The mobile logo looks good now but now without that extra padding the desktop logo isnt centered vertically as you can see here:
    https://ibb.co/nhFfLF

    July 13, 2017 at 4:41 pm #820646
    Jordan Shannon

    Hi,

    I see. Add the the following to quick css:

    @media only screen and (min-width: 767px)  {
strong.logo img {
margin-top:40px!important;
}
}

    Best regards,
    Jordan Shannon

    July 13, 2017 at 7:38 pm #820756
    musedesignca

    That worked great thanks.
    One more problem Im having is now the sticky header logo isnt in the proper position as seen here:

    https://ibb.co/nnVQ4a

    July 13, 2017 at 10:08 pm #820824
    Nikko

    Hi,

    Can you try to add this code inside the code given to you by Jordan?

    
.header-scrolled strong.logo img {
    margin-top: 0 !important;
}

    so it should look like this:

    @media only screen and (min-width: 767px)  {
  strong.logo img {
    margin-top:40px!important;
  }

  .header-scrolled strong.logo img {
    margin-top: 0 !important;
  }
}

    Hope this helps :)

    Best regards,
    Nikko

    July 13, 2017 at 11:29 pm #820864
    musedesignca

    That worked but the sticky header logo wasnt scaling down so I added this as well:

    .header-scrolled {
    min-height:80px;
    }
    .header-scrolled .logo, .header-scrolled .logo img, .header-scrolled .logo a {
    min-height:80px;
    }

    It seems like the logo is losing resolution when it scales down to the sticky header size now which seems strange. Do you know why? Its not as clear as the full size logo.

    July 14, 2017 at 1:43 am #820906
    Jordan Shannon

    Hi,

    It does not appear to lose quality when I view it. I am using Chrome on a PC.

    Best regards,
    Jordan Shannon

    July 18, 2017 at 12:03 am #823028
    musedesignca

    Ok thanks, it must just be a firefox thing. I will test it in other browsers.

    July 18, 2017 at 2:58 pm #823328
    Jordan Shannon

    Hi,

    Please do and let us know the result. And, you can also try re-uploading the logo.

    Best regards,
    Jordan Shannon

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