Background Image Changes Size On Contact Us Page

trevorellis

On the website for Utilities R Us Ltd UK, we have made an image part of the background using the following code in the custom.css:

body {
	background-image: url(/images/Background.jpg);
    background-repeat: repeat-y;
    background-size: cover;
}

However, we are finding that on the Contact Us page (http://www.utilitiesrusltd.uk/index.php/contact-us), the image is being re-sized differently to how it is on another page such as the Home page (http://www.utilitiesrusltd.uk/index.php). We are not sure what is causing the image to be re-sized differently. Please can you help? We are using the Uber template and have tested this on both Microsoft Edge and Google Chrome.

Joshua-M

Hi,

I can't see the the difference in background image between frontpage and contact us pages, did you clear your browser's cache?

Cheers
Joshua

trevorellis

Joshua-M We have tried accessing the websites on a different device (laptop instead of a PC desktop). We have tried accessing the site from different browsers (Chrome, Edge and Internet Explorer) and clearing the cache. The problem persists. We think that it is stretching the background image along the x axis more when the pages are longer/have more content. We just want the background image to repeat along the y axis if a page is long and NOT stretch along the x axis. What do we need to do to achieve this?

trevorellis

Joshua-M We have resolved the issue with the following code:

body {
	background-image: url(/images/Background.jpg);
    background-repeat: repeat-y;
    background-size: 100%;
}