Shopify themes, liquid, logos, and UX
I'm using the Dawn 13.0 theme. I got the image I wanted on the desktop on the homepage. Although it asked for two images in the banner, I uploaded a single image and there is no problem. But when I check from mobile, a very bad image occurs. Officially half of the page is empty 🙂 How can I fix this? Preview link below. Thank you in advance.
https://ujpt9cyruh3i95w0-85574287682.shopifypreview.com
Solved! Go to the solution
This is an accepted solution.
@hefoli please add the below code to the "base.css" file
@media screen and (max-width:480px){
.banner {
height: 100vh;
}
.banner__media{
height: 100vh;
}
}
This is an accepted solution.
@hefoli add the code in "section-image-banner.css" file.
This is an accepted solution.
@hefoli please add the below code to the "base.css" file
@media screen and (max-width:480px){
.banner {
height: 100vh;
}
.banner__media{
height: 100vh;
}
}
Unfortunately it didn't work 😞
Hey @hefoli
Can you please share me the screenshot of code you have added. also , I can't see the code i have given to you on the website.
When it didn't work, I deleted it to avoid an error. Now I'm adding it again and sending ss. When it didn't work, I deleted it to avoid an error. Now I'm adding it again and throwing ss. This method only takes the image from top to bottom on mobile, but does not make it full page. I will not remove the code so you can check it on mobile.
This is an accepted solution.
@hefoli add the code in "section-image-banner.css" file.
DUDE, YOU ARE AWESOME! Thanks for your helping!
@media (max-width: 771.98px){
div#Banner-template--22121307996482__image_banner {
height: 100vh!important;
}
}
Terence Keane
Best Regards,
Discover how to increase customer engagement on your store with articles from Shopify A...
By Jacqui Apr 23, 2025Hey 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, 2025