How To Reduce Mobile Header Logo Font Size Debut Theme

Store Design
1

Hi there,

May I know how to reduce the mobile header logo font size?

Here I didn’t upload my logo picture and it is default logo name. Since the sticky header position is limited, now the logo name separated into two lines.

Does anyone how to fix this problem on the mobile header? Huge thanks in advance. https://staresso.com/

e5297ce68e03318d686a3508268be25.jpg
e5297ce68e03318d686a3508268be25.jpg1080×1920 110 KB

2

hello @m2mmm2

please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

@media only screen and (max-width: 749px){
.site-header__logo {
     padding-left: 0 !important; 
    
}
}
2 Likes
3

Hello There,

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

@media only screen and (max-width:425px){
a.site-header__logo-link {
font-size: 10px!important;
margin-left: -20%!important;
}
}
1 Like
4

Hi Natztech,

Excellent!! This work as magic!

Many thanks,

Have a lovely day

1 Like
5

Thank you for your response. It’s good to know that it’s worked for you. Kindly feel free to get back to me if you need any further assistance.