Hero Section Background image not mobile responsive

Hi.,

Please provide your site URL for better understanding.

If you want further help I’ll be happy to assist.

Thanks.,
Rajan V

Hi Rajan!

my website is here

I think you have about that clock bg right?

If yes try this css

@media (max-width: 767px){
	.appointments-section {
	    background-image: url(https://duoserve.co.uk/wp-content/uploads/2018/01/clock-2198763_1280.png); !important;
	}
}

If you want further help I’ll be happy to assist.

Thanks.,
Rajan V

No, it’s not the clock.

It’s the DUOSERVE background on the top of the page where it says PUTTING OUR CUSTOMERS NEEDS FIRST

the image behind it won’t readjust according to screen size

Ok try this css

@media (max-width: 767px){
	.intro-section{
		background-position: top center;
    	background-size: 100%;
	}
}

Thanks.,
Rajan V

Hi,

It’s me again. I’m trying to work out where I should put it – css editor or the html page text

You need to put this code on your child theme style.css file

Sorry still confused. do you have an example as to where we should put it ?

Hello @missusb,

You can add that code in Appearance > Customize > Additional CSS and then save.

All the best,
Mihaela

Thank you for the help, Rajan V and mplusb!

Cheers ??

Hello, I’m having simillar problem with the HERO section image on mobile.

My site is: https://logonabloga.pl

If you view it from mobile, the dog is not visible at all (and its quite important, as the headline refers to him)

I tried the CSS above but it did not work (yes, I changed the image url to mine)

Any ideas? ??