How to change logo size on mobile?

Solved
Highlighted
Tourist
11 0 2

Hi,

 

The logo on the mobile version of my website is very small and I'd like to make it bigger.

 

I see that it is not possible through the customize page.

 

My website is https://www.vithithihandmade.com and I'm using the Brooklyn theme.

 

How can I do it?

Thanks, Max

0 Likes
Highlighted
Tourist
8 4 2

This is an accepted solution.

Hi Max,

 

First of all please remove white space around logo and then please add this css code at the end of theme.scss.luid file

@media screen and (max-width: 768px){
.site-header__logo img {
 max-height100px;
} }

If you still want to increase logo size then increase max-height value in above code instead of 100px 


For any help you can Contact me on helly.parekh93@gmail.com

Highlighted
Tourist
11 0 2
Hello,

What white space around the logo?

Anyway, thanks, it works.

Mx
Highlighted
Tourist
6 0 1

I had the same issue.  The logo was the perfect size on the desktop, but tiny on mobile devices.  This code has resolved the issue.  

0 Likes
Highlighted
New Member
1 0 0

What white space?

0 Likes
Highlighted
Tourist
6 0 1
I don’t know what the previous responder meant by ‘white space’ in this context, but the code definitely worked for me.
Highlighted
New Member
2 0 0

They likely meant that the actual graphic had white space around it in the source image, ie the bounding box for it was not flush with the graphic but had a 'margin'. With your logo, in whichever package you use, ensure that the actual graphic portion of your artboard is what is bound by the artboard, don't let there be pixels worth of actual white space around it or else it will show up and distort your coded sizing.

0 Likes
Highlighted
Tourist
4 0 1
I did this exact code on my website but it didn’t seem to change anything.
Highlighted
Tourist
6 0 1

Same for me. This solution doesn't work


@Euphorictech wrote:
I did this exact code on my website but it didn’t seem to change anything.

 

0 Likes
Highlighted

@Cyborg,

Please share your site url so that I will give you exact solution

Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit