Utilities
Full Width Image & Video Blocks in Squarespace
Desktop + Mobile
/**
* Full Width Block
**/
#block-id {
padding: 17px 0px;
width: 100vw;
position: relative;
left: 50%;
right: 50%;
margin-left: -50vw;
margin-right: -50vw;
.sqs-block-content{
max-width:1250px;
margin:auto;
}
}
Mobile Only
/**
* Full Width Block
**/
@media(max-width:767px){
#block-id {
padding: 17px 0px;
width: 100vw;
position: relative;
left: 50%;
right: 50%;
margin-left: -50vw;
margin-right: -50vw;
.sqs-block-content{
max-width:1250px;
margin:auto;
}
}
}
References: Ahmad Shadeed, CSS Tricks
View Source
Last Updated: 5/1/2025