Customize Gallery Database Columns
You can customize the number of columns displayed in your Gallery database by adding custom CSS. This allows you to create a layout that better fits your content and design.
Small Gallery Cards
To display 3 columns for Small gallery cards:
.notion-collection-gallery.small {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
Medium Gallery Cards
To display 3 columns for Medium gallery cards, add the following CSS to your site's Code → CSS section:
.notion-collection-gallery.medium {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
Large Gallery Cards
To display 3 columns for Large gallery cards:
.notion-collection-gallery.large {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
Change the Number of Columns
To display a different number of columns, replace the value inside repeat() with your preferred number.
For example:
repeat(2, minmax(0, 1fr))→ 2 columnsrepeat(3, minmax(0, 1fr))→ 3 columnsrepeat(4, minmax(0, 1fr))→ 4 columns
Adjust the Container Width (Recommended)
If your gallery cards appear too narrow or feel crowded after increasing the number of columns, you can expand the content area by adjusting your site's container width.
Navigate to:
Design → Layout → Container Width
Increasing the container width provides more horizontal space for your gallery, allowing each card to appear larger and reducing the crowded appearance.
Tip: The more columns you display, the wider your container should be. If you're using 3 or more columns, increasing the container width is recommended for the best visual result.