How To Fix Mobile Logo on Shopify Debut Theme

ellendickenson
Visitor
2 0 0

Hello! I am having issues with my mobile logo for my Shopify Store Debut Theme. Originally I increased the logo size on the desktop version and centered it, but now the mobile logo is wider than the page. I have tried a lot of different codes, but I can't seem to get it to fit in the right size. My shop is willowgrovehome.myshopify.com and password "shop". Please let me know if you can help! 
Thanks so much! 

Ellen 

Replies 2 (2)

diego_ezfy
Shopify Partner
2935 562 883

@ellendickenson 

Hey,

the code you added is breaking your website, ideally you'd need to use a media query for it. 

Do this to fix it in 20 seconds:

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss.liquid or theme.css and paste this at the bottom of the file:

@media (max-width: 767px){
    [id] .site-header__logo img{
        max-width: 100% !important;
        width: 100% !important;
    }
}



Please let me know whether it works.

Kind regards,
Diego

◦ Follow my blog & youtube for coding tutorials. Most questions in here are already answered there!
◦ Top #4 Shopify Expert, 24h reply. Click here to hire me.
Download copy/paste code snippets that can replace most apps.

ellendickenson
Visitor
2 0 0

Hi Diego! Unfortunately that code didn't work for the mobile logo, but I discovered I had an error in my @media screen and (min-width: 250px) line, so I was able to fix it and change the logo to a smaller size. Thank you for your time!