Make Logo Smaller on Mobile View - District Theme

New Member
4 0 0

I am looking to make my logo smaller on mobile view only. I am using the District theme, Any help is much appreciated. Thanks.


Hello @Patrick_Sowa ,
You can add this code at the bottom of theme -> edit code -> assets -> theme.scss.liquid

@media screen and (max-width: 480px)  { img {
	max-width: 80% !important;
	margin: 0 auto;
Want to modify or incorporate custom changes on store, Hire us.
If helpful then please Like and Accept Solution .
Skype : oscprofessionals-87
Free Review and advice for sale on store | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | SEO & Digital Marketing | Site Speed Optimization | Performance Site Audit
1 Like
Shopify Expert
665 170 199

Hi, @Patrick_Sowa ,

This is Evita from On The Map.


1. Go to Online Store->Theme->Edit code
2. Asset->theme.scss->paste bellow code in bottom of file

@media screen and (max-width: 700px)  {  
  .logo-image img {
    height: 1rem!important;



On The Map Marketing | Developing custom Shopify Sites & Apps is our thing

- Install our latest app Accessibly - Makes your store accessible for everyone, helps to avoid fines
- Inc 5000 | Shopify Parners | 20+ stores launched | 300+ active clients
- Need help with your Shopify store? Reach out to us!