Hi Skandha,
Sorry if you are still looking into this, but I also tried an adaptive images plugin. It didn’t change the header on mobile, so I also contacted their team and they gave me this response:
It is this CSS property in this element https://prnt.sc/26l93nx/ that causes the image to extend beyond the visible part of your screen in mobile screen sizes. If it could be changed to this https://prnt.sc/26l968i/, ie background-size: contain;, then the whole of the image would be contained inside the element and the screen.
It’s a little hard to say how your theme could accommodate this change. Perhaps it is some setting it can provide? Or perhaps a page builder? Or, ultimately, one could write some custom CSS in a child theme or in the Customizer.
Again apologies if this is stepping on your toes but maybe it’s helpful. I’m not really sure what I can do on my end with this information though, as I don’t know how to change CSS property.
Kind regards,
Maria
