Shopify themes, liquid, logos, and UX
I want to make my website responsive to mobile view, and for the footer I have added my brand logo - this looks good in the desktop view but when I am looking on my phone the logo looks quite big. How can I change the size of the image just for my phone.
Solved! Go to the solution
This is an accepted solution.
@KN2002 please add this css to the very end of your base.css file and check,
Shopify Admin -> Online Store ->Theme -> Edit code -> base.css
@media screen and (max-width:749px){
.footer-block__image-wrapper img {max-width: 70%; margin: 0 auto;}
}
My website is not live yet, it is still wip.
renovawears.in
Shared on message
This is an accepted solution.
@KN2002 please add this css to the very end of your base.css file and check,
Shopify Admin -> Online Store ->Theme -> Edit code -> base.css
@media screen and (max-width:749px){
.footer-block__image-wrapper img {max-width: 70%; margin: 0 auto;}
}
This did not work 😞
made this change, but it is still not working 😞
@suyash1 Hey, the solution worked - I applied it on the custom css. thanks so much 🙂
Any idea if we can also change the padding between image and quick links (next section in the footer)?
@KN2002 - add this as well
@media screen and (max-width:749px){
.footer-block__details-content.footer-block-image {margin-bottom: 0rem;}
.footer-block-image .footer-block__image-wrapper {margin-bottom: 1rem;}
}
@KN2002
Please share your store live link with your Password. So I can see your store and would be help for you.
Shared through message
Hey Community 👋 Did you know that March 15th is National Everything You Think Is W...
By JasonH Apr 1, 2025Discover how to increase the efficiency of commerce operations with Shopify Academy's l...
By Jacqui Mar 26, 2025Shopify and our financial partners regularly review and update verification requiremen...
By Jacqui Mar 14, 2025