How to make Shopify Image Banner Items responsive

[chichi0114]

Hi,

I figured out how to add my logo on top of the Image Banner, but I realized that the image and text doesn’t seem to be responsive as it shows up funny on mobile. How can I fix this to ensure that it is responsive on different screen types ie. ipad, iphone, etc.

Thank you,

[NerdCurator]

@chichi0114 You need to add this code in the theme files. For which you need to go to Online Store > Actions (Active theme) > Edit Code > Assets, under assets add the code at the bottom of base.css file.

.banner__content .banner__box .image_container img{
object-fit: contain !important;
}

[chichi0114]

Hi NerdCurator,

It fixed the issue thank you so much!! But now, the heading is not centered for the mobile version.