Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #824602

    Hi. I have my logo full-size and centred in desktop mode using Quick CSS. This works well.
    When in mobile mode, I would like the logo to revert to the standard small size and be left-aligned, whereas it seems to currently be aligned just off-centre.
    I believe it worked before the latest update, but that might be the wider new burger menu items making the incorrect alignment more obvious.
    I’ve tried modifying my Quick CSS, shown below, to only apply to large screens, but it doesn’t seem to work:

    @media only screen and (min-device-width: 768px) {
    .html_header_top.html_logo_center .logo img {
    margin: auto;
    }
    .html_header_top.html_logo_center .logo {
    left: 0;
    -webkit-transform: none;
    -ms-transform: none;
    transform: none;
    width: 100%;
    }
    }

    Thanks in advance for any help. :)
    Sam

    #824766

    Hey sammacs,

    Please provide a screenshot of how the logo is being view on mobile for you.

    Best regards,
    Jordan Shannon

    #824861

    Hi,
    I have added the screenshots in the private content below.
    The first screenshot is how the mobile site looks for me with the incorrect alignment.
    The second screenshot is how it looks if I remove all the Quick CSS I provided in my original post. This is how I want the mobile header to look, but obviously the non-mobile version then won’t look how I want it to with any Quick CSS.
    Thanks,
    Sam

    #824886

    Hi,

    I see, add the following to quick css:

    @media only screen and (max-width: 767px)  {
    .logo a {
    overflow:visible!important;
    }
    
    .responsive .logo img {
    max-width:70%!important;
    }
    }

    Best regards,
    Jordan Shannon

    #824906

    Thanks for the help. I have added the code you suggest to the bottom of the Quick CSS I already have but it is still not working correctly. All that has changed is now the logo goes even smaller when resizing the browser window, but the logo is still in the off-centre position rather than being left-aligned when in mobile mode.
    Sam

    #827501

    Hi,

    This worked for me. Please provide admin info so we can log in and look into this issue further. Generally I prefer the suggested css to be added to the top of quick css just to make sure it runs first before any errors in user css breaks it.

    Best regards,
    Jordan Shannon

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