I’ve tried a few times to get this to work. My logo in the header of my website is great on my laptop at home, but on the mobile its about 50 percent too small. I’d like to exactly double it in size on mobile.
I tried some code last time in the base.css but it just flattened the logo and made it larger. I would to scale it up exactly 100 percent.
password is “password”
Thanks
Hi @jameschef86
This is David at SalesHunterThemes.
To increase the header logo size on mobile
Follow this path:
Themes => edit code => asset => base.css
and add this code to bottom of the file base.css
@media(max-width: 749px){
.header {
padding-inline: 10px;
grid-template-columns: 1fr 5fr 1fr;
}
}
Hello @jameschef86 
You can add this code to base.css
@media (max-width: 989px) {
.header__heading-link {
padding: 0;
margin: 0 -16px;
}
}
The result
Hope that helps!
@jameschef86
add this code to your base.css file.
Navigate to the online store >> Click edit theme code.
Now find base.css and paste the following code:
@media(max-width:980px){
.header {
padding-inline: 5px !important;
grid-template-columns: 1fr 7fr 1fr !important;
}
}
This code seemed to work the best, but there was this line that is now there between the picture. Any way to get rid of that? Much thanks!
@jameschef86
To get rid of the line please add the code into base.css file
@media(max-width:980px){
.section-header.shopify-section-group-header-group{
margin-bottom: 0 !important;
}
}