We're moving the community! Starting July 7, the current community will be read-only for approx. 2 weeks. You can browse content, but posting will be temporarily unavailable. Learn more

Shopify Dawn theme Banner Image is not fitting to screen.

Shopify Dawn theme Banner Image is not fitting to screen.

Sattire
Visitor
3 0 0

Hi,


I'm trying to fit the banner image to the entire mobile screen. But it's not happening. I've tried all kind of codes that were shared for similar problems, but nothing seems to work. 

The banner image is taking only half of the screen on mobile, and the rest is taken by other sections.

I wanted the banner image to fill the screen entirely on any mobile device, so that only the banner image is visible when a customer lands on the mobile version of the website.

 

Replies 3 (3)
Sattire
Visitor
3 0 0

@kaiyaa Thanks for the reply. But I've tried using different images for Desktop & Mobile. But the second image still is not covering the entire screen. It's still covering nearly 60% of the screen only. 

Sattire
Visitor
3 0 0

tim
Shopify Partner
4812 598 1733

You can always add 

.banner { height: 100vh; }

to the section "Custom CSS" settings but be prepared that your image will be cropped depending on the browser width/height.

If my post is helpful, hit the thumb up button -- it will help others with similar problem to find a solution.
I can be reached via e-mail tairli@yahoo.com