How can I resize my image banner for mobile view?

Hi

Please check the below screenshot for the mobile view,i would like to increase the size of the image little bit

https://click.email.shopify.com/?qs=33c50a4408389bfb311d4ac96e0294b1a8cfe0b48dc71ba7d8d0060648ad5ddb6f055d9bdcdc800ade562333ed78406bf2f1b410a6ca33d0b06e0798fa325059

Password: Testtest-1

Hi @mostafa123 ,

Go to Assets > section-image-banner.css and paste this at the bottom of the file:

@media (max-width: 749px) {
	#shopify-section-template--15376751165594__image_banner .banner__media {
		width: 100% !important;
	}
	#shopify-section-template--15376751165594__image_banner .banner__media img {
		width: 150% !important;
		max-width: 150% !important;
	}
}

Hope it helps!

Thanks a lot …it worked but do you know how to move the text and button down a little bit (i need the button to touch the top edge of the banner)

Hi @mostafa123 ,

Go to Assets > section-image-banner.css and paste this at the bottom of the file:

@media (max-width: 749px) {
	#shopify-section-template--15376751165594__image_banner .banner__content {
		margin-bottom: -45px !important;
	}
}

If it helped you solve your issue, please mark it as a solution. Thank you and good luck.

Unfortunately this didn’t work :disappointed_face:

Hi @mostafa123 ,

I checked and didn’t find the added code, you added it at section-image-banner.css file?

Please go to Assets > section-image-banner.css and paste this at the bottom of the file, it will work fine.

If it helped you solve your issue, please mark it as a solution. Thank you and good luck.

I added it already but deleted the code when it didn’t work.

I will leave it for you to check.

Many thanks

Hi @mostafa123 ,

i checked and it works fine, isn’t this what you want?

You can increase the number, it will make the image and text closer together.

Hope it helps!