Our website banner gets cut off on mobile. We’re using the Debut theme. What’s the code to fix this?
sorry for this issue try this code
- Go to Online Store->Theme->Edit code
- Asset->/theme.scss.liquid->paste below code at the bottom of the file.
@media only screen and (max-width: 749px) {
#shopify-section-hero .hero--large {height: 140px;}
}
https://www.mojoin.com/show-shopify-banner-image/
also, you have try this different image desktop and mobile
Thank you!
it’s my pleasure to help us
Hi my banner also gets cut off using a phone and I’m also using the Debut theme. I used the code you posted but it didn’t work for me.
my shop is : Kandelaarco.com
Thank you
Sorry you are facing this issue, it would be my pleasure to help you.
Welcome to the Shopify community! 
Thanks for your good question.
Please share your site URL,
I will check out the issue and provide you a solution here.
hii, @USClinicals
Kindly share your site URL so,
I can solve your issue.
Thank You.
hii, @USClinicals
Paste this code on top of the theme.scss file.
@media only screen and (min-width: 992px) {
.item.item--85370d67-2cb3-4a75-a485-06c93399d92e.item--text-light.original-height.js-section-container.is-selected {
margin-top: 101px !important;
}
}
Thank You.
Hi @Zworthkey still cropped off, can you check again?
@USClinicals
On my device, it is looking perfect.
You can increase your image size.
Thank You.
@Zworthkey I dont but i still see some cropped off at the bottom, mobile view also being cropped off, can you help on this as well?
Size: 702 by 450
Thank you so much.
We have checked for this issue in real system and browserstack but it is working ok. In which system configuration or browser you are checking?
hi @KetanKumar I am using Chrome, chrome display 1920 x 1080.
Please check on your mobile view, i think the desktop on is fine more of the mobile view now.
yes all device is working fine
Hi Let me know if you guys can offer a solution @KetanKumar . Thank you
Click on the section height option under banner image and choose adapt to image.