I need my banner image to fit both on desktop and mobile, right now its one or the other.

I need my banner image to fit both on desktop and mobile, right now its one or the other.

UPPFUEL
Excursionist
17 0 4

Is there a way to get rid of the white space on mobile when it fits desktop or to add different amounts of padding from mobile to desktop?

Screenshot 2024-01-08 093848.pngScreenshot 2024-01-08 093902.pngScreenshot 2024-01-08 102429.pngScreenshot 2024-01-08 102437.png

Replies 2 (2)

Made4uo-Ribe
Shopify Partner
9567 2278 2825

Hi @UPPFUEL 

I check your store seem like your using different section. 

Made4uoRibe_0-1704729258808.png

This is not a banner section this is a Rich Text section. This section are not design with a bigger image. Im not sure how you manage to insert the image in the rich text. 

Made4uoRibe_1-1704729352272.png The Image banner should look like this.

Made4uoRibe_2-1704729530521.png

And with the adjustable height. 

Made4uoRibe_3-1704729573540.png

 

 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

If this fixed your issue, Likes and Accept as Solution are highly appreciated. Coffee tips fuel my dedication.
Get experienced Shopify developers at affordable rates—visit Made4Uo.com for a quick quote!
Need THEME UPDATES but have custom codes? No worries, for an affordable price.
Create custom Shopify pages effortlessly with PageFly's drag-and-drop ⚙️.
UPPFUEL
Excursionist
17 0 4

Yeah I used a custom css code 

{
background: url("https://cdn.shopify.com/s/files/1/0764/6819/1509/files/Screenshot_2024-01-06_at_6.17.57_PM.png?v=170...")
no-repeat center;
background-size: 100%;
}

but i tried to use a banner image but the image is way to wide so it was why used rich text and added this code to make it look right