user3191160 user3191160 - 6 months ago 49
CSS Question

Background Image repeating when resizing windows width

i am trying to create a page that has a background image in between a

will work on any screen size.

I have managed to create the page and it works fine on desktop screen. The problem i have is when I resize to
mobile size screen
then the background is repeated.

Here is my code:

div {
width: 100%;
height: 5886px;
background-image: url('services-yellow.jpg');
background-size: 100% auto;
background-repeat: none;
border: none;

Has the height attribute set at a specific height, but i am not sure how i can change this so that it works on all screen sizes.

The site can be viewed at:

If somebody could please advise on how i could fix this, would really appreciate it.

Thanks in advance.


none is not a valid value for background-repeat, use no-repeat instead.

background-repeat property (MDN) (W3Schools)