Logo Size Error in Mobile

Highlighted
New Member
2 0 0

Hi,

I've been trying to align my logo to the rest of my text. I have got this to work on desktop but now the logo on mobile matches the size of the logo on desktop and is therefore way too big.

The only code I added was in header.liquid line 542 "padding-left: 60px;".

I'm using the Flow theme. Here is the url - https://monkschai.com/

Any help here would be amazing.

Cheers,

0 Likes
Highlighted

@TheMonk 

Do this to fix it in 20 seconds:

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

 

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

 


You can change the value 100px to any value you wish.

Please let me know whether it works.

Kind regards,
Diego

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Needing urgent help? I'm available for hire, same day response guaranteed: diego.boarutto.fortes@gmail.com
◦ My app free for limited time: Add a navigation styled like Instagram Stories to your website!
0 Likes
Highlighted
New Member
2 0 0

@diego_ezfy  that worked perfectly. Thanks so much

0 Likes
Highlighted

@TheMonk You're welcome!

Please make sure to click on the button "Accept as Solution" below my answer to help other people in the community with similar issues. 

Kind regards,
Diego

◦ Problem Solved? ✔️ Please click on Accept as Solution and like.
◦ Needing urgent help? I'm available for hire, same day response guaranteed: diego.boarutto.fortes@gmail.com
◦ My app free for limited time: Add a navigation styled like Instagram Stories to your website!
0 Likes