I'm trying to add custom css to a Squarespace page that will add a background image behind a block of text to this page: https://www.seacureadvisors.com/seacure-advisors.
The code I have added to the page is:
div#block-yui_3_17_2_1_1710885486557_10443{
background: url(https://static1.squarespace.com/static/5fce63b9abf5bd69920abec0/t/5fdade0435c0500e7fa30a42/1608179207346/footer-bg.png);
padding-top:40px;
padding-bottom:40px;
background-size: cover!important;
width: 100%;
font-size: 13px;
background-repeat: no-repeat;
background-position: center;
color: #666;
margin-bottom:-85px;
margin-top:20px;
}<div id="#block-yui_3_17_2_1_1710885486557_10443"></div>How would I get the image to span the entire width of the page?
If there is in fact no way to add that content to its own section which is set to be full width (instead of it being a part of the main body), then the following CSS, added to the CSS you posted in your question, will achieve the full-width effect that you're looking for.
width: calc(100vw - 17px);
margin-left: calc((100vw - (100% + 17px)) / -2);
box-sizing: border-box;
As a preemptive note, if you were to add the CSS via the CSS Editor instead of via a style tag as you did, you would have to use the following instead of the above, due to Squarespace's LESS interpreter/compiler:
width: ~"calc(100vw - 17px)";
margin-left: ~"calc((100vw - (100% + 17px)) / -2)";
box-sizing: border-box;