How to make a Squarespace Archive Block dropdown full width

When customising a Squarespace site, you may notice that the Archive Block or blog category dropdown doesn't span the full available width. This can make longer category names difficult to read and the dropdown feel cramped.

A simple CSS snippet fixes the issue by forcing the archive dropdown container to use the full width.

This snippet sets the minimum width of the Squarespace Archive Block dropdown to 100%, allowing the blog category selector to expand across the available space.

To make the block full width in mobile view, simple drag the block to span the full width of the screen.

Custom CSS

Simply add the CSS to Design → Custom CSS, save your changes, and refresh your site to see the updated dropdown width.

 .archive-block-setting-layout-dropdown.archive-block-wrapper {
  min-width:100%!important;
}

---

Check out our library of code snippets and site enhancements.

---

---