Layout

How do I center content vertically in a Squarespace section?

Use flexbox on the section's content wrapper to vertically center everything inside. Set a min-height on the section so there's vertical space to center within.

This is especially useful for hero sections where you want text and buttons centered in the viewport. Combine with text-align: center for full centering.

[data-section-id="YOUR_SECTION_ID"] {
  min-height: 80vh !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

[data-section-id="YOUR_SECTION_ID"] .content-wrapper {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center;
}

Build centered sections with our Section Builder toolTry it free →

Related Questions

How do I change the section padding in Squarespace?

How do I make a section full width in Squarespace?

How do I hide a section on mobile in Squarespace?

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 →