[SOLVED] How do I repeat an image on both sides vertically?

How do I repeat an image on both sides vertically?

I've only successfully made the background image go down vertically on the left side of the website. But I haven't figured out how to make the background image do the same thing to the right of the webpage.

<style>
    body {
    background-image: url('background.png');
    background-size: 950px;
    background-repeat: repeat-y;

    }
</style>

I've tried duplicating the image and making it go to the right but that didn't work. It just ended up messing with the background image to the left go to the center.

Solution

If you only want your image repeat vertically but on both sides of your page. You may give 2 same backgrounds but put them on different sides:

background:
  url('background.png') left / 950px repeat-y, 
  url('background.png') right / 950px repeat-y;

Pay attention it's background but not background-image. It is a shorthand for:

background-image: url('background.png'), url('background.png');
background-position-x: left, right;
background-size: 950px, 950px;
background-repeat: repeat-y, repeat-y;

Here's a live example:

body {
  background: 
    url('https://picsum.photos/120/120') left / 120px repeat-y, 
    url('https://picsum.photos/120/120') right / 120px repeat-y;
}