Background image

Helpdesk Website Builder
1

I am new to sitejet. I made a website: sitejet.tgscorp.com . When I view in desktop mode the background image is the way I like it. When I view in phone mode the background image is compressed towards the top and not occupying the background. I am not sure how to fix this for this ‘viewport’.

2

Hi @Johnnsaad
Welcome! :wave:

@Andre, I’d love to help John here, but I have no idea what to look for in Chrome’s inspect tool.
Could you maybe guide us a bit?

John, hang in there. It’s Saturday, so someone will probably get back to you on Monday.
:muscle:

3

Hey there,

Would you be able to go into the Website Builder and copy the six-digit number in the URL here? That is the Website ID. Need to check what setting is causing this.

@Richard_Honey will post the solution here. I reckon this is not that easy withough going into the Builder :slight_smile:

1 Like
4

579392 is the 6 digit number

5

Hey there,

so first of all I removed the lazyload from the picture on desktop.

Then, I found this custom css that is disrupting the image:

/*homepage extra styling*/
.preset-banner-v3-tech-startup-homepage {
	/*End honycomb pattern background images*/
	.banner-content .background-image-holder {
		//background-position: center -250px !important;
		@media screen and(max-width: $breakpoint-md) {
			background-position: 150% -200px !important;
			background-size: 500px auto !important;
		}
	
		@media screen and(max-width: $breakpoint-sm) {
			background-position: center -250px !important;
			background-size: 395px auto !important;
		}
	}
}

/*about page extra styling*/
.preset-banner-v3-tech-startup-about-page {
	.background-image-holder {
		background-size: 50vw auto !important;
	
		@media screen and(max-width: $breakpoint-xs) {
			background-size: 90vw auto !important;
		}
	}
}

It seems, that it comes from the template. We will adjust it soon - and I have changed the code for you on your site.

6

ok. you can change my website?

7

Hey John,

Yes, we adjusted the code on your website.

8

ok, thank you for that. I think it looks great. Lots to learn!

1 Like
9

Keep your questions coming :slight_smile: That’s what we are here for.