So I have an image which is acting as a background and it 'scales to fill' the frame which is just how I want it, but the image is not centered and thus when the window is smaller like on a phone, the image displayed is just the edge. Here is the code I was using:

**HTML**

```
<div class="Background">
<div>

```

**CSS**

```
.Background {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100vw;
    height: 100vh;
    background-image: url('background.png');
    background-size: cover;
}

```

If anyone could give me some hints then that would be great. Thanks