SKYE: Adding a Site Background with CSS

I've been searching for an answer for this for a while, but can only find very specific advice for background images (like how to have a different one on every page) that doesn't help me.

I've got a Skye template ("Ready" specifically) and want to add a background image to my site. Couldn't find it in the settings, so I'm looking for some quick CSS I can pop in and get a site-wide background image. I've already uploaded my image as a custom file so I have a URL ready.

My website is storybriar.com.

main#page {
    background: url(https://beaverhero.com/wp-content/uploads/2019/07/coffee-beans-1082116_640-min.jpg) no-repeat center center;
    background-size: cover;
}

thank you for your help! unfortunately, all that's done is put a background around my actual content on the pages, and only on some of them. I need it to reach the edges of the site page that are currently black. check my website again to see how it looks now.

any ideas?

2 hours ago, Ella_S said:

thank you for your help! unfortunately, all that's done is put a background around my actual content on the pages, and only on some of them. I need it to reach the edges of the site page that are currently black. check my website again to see how it looks now.

any ideas?

body {
    background-image: url(https://beaverhero.com/wp-content/uploads/2019/07/coffee-beans-1082116_640-min.jpg);
    background-size: cover;
}

Struggled for a while trying to make my 3 backgrounds look like one, but I don't think squarespace can do what I need it to with this template, even with CSS. Thanks again for the help!

4 minutes ago, Ella_S said:

Struggled for a while trying to make my 3 backgrounds look like one, but I don't think squarespace can do what I need it to with this template, even with CSS. Thanks again for the help!

Try this CSS

body {
    background-image: url(https://beaverhero.com/wp-content/uploads/2019/07/coffee-beans-1082116_640-min.jpg);
    background-size: cover;
}