parallax images not resizing for mobile

[adventium]

the top parallax images are not resizing smaller for mobile. How can I change it so it reduces like the bottom images for mobile?

---

[Support]

Hello, my suggestion is to add a custom class, for example: “my-custom-parallax”

HTML:

<section class="my-custom-parallax parallax section section-parallax custom-parallax-bg-pos-left custom-sec-left h-100 m-0" data-plugin-parallax data-plugin-options="{'speed': 1.5, 'horizontalPosition': '100%'}" data-image-src="img/BZImages/1920x1100Doc.jpg" style="min-height: 315px;">
</section>

And then customize CSS (css/custom.css):

@media (max-width: 991px) {
	.my-custom-parallax {
		min-height: 31vw !important;
	}
	
	.my-custom-parallax .parallax-background {
		background-size: 100% !important;
	}
}

Best Regards,

Okler Themes

---

[adventium]

I tried adding the html code as suggested, but it’s not working. If you view the page on mobile, the images are not responsive. They should be scaling down, but they are not.

Same problem with the hero images and type — neither are scaling down for mobile as you can see here: https://bodhizone.adventium.net

Please advise how to make images and type scale down for mobile.

---

[Support]

This reply has been marked as private.

[adventium]

I tried adding to the hero height: 100vw; max-height: 75vh but now the image is too tall. Is it possible to keep the same height as when it was 550px?

---

[Support]

Hi, sure, you can set those numbers to height: 100vw; max-height: 550px;

---

[Author]

Posts