Layout

How do I make a section full width in Squarespace?

Squarespace 7.1 constrains content within a max-width container. To make a section truly full-width, override the content-wrapper width and remove horizontal padding.

You can target all sections globally or use the section ID for specific ones. This works well for image banners, colored background sections, and full-bleed layouts.

/* Make specific section full width */
[data-section-id="YOUR_SECTION_ID"] .content-wrapper {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Or make ALL sections full width */
.page-section .content-wrapper {
  max-width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

Build full-width sections with our Section Builder toolTry it free →

Related Questions

How do I change the section padding in Squarespace?

How do I hide a section on mobile in Squarespace?

How do I center content vertically in a Squarespace section?

How do I add a divider line between sections in Squarespace?

A little over your head?

No shame — this stuff is hard. Let the pros handle it.

Talk to Long Drive Marketing →