Skip to content

Component Layout

Alfred J Lin edited this page Mar 12, 2026 · 1 revision

Introduction

The component layout is used to arrange multiple components side by side in a column grid within the content area. It supports 1 to 4 equal-width columns and is intended for use inside the Layout Builder.

This is different from the Layout Builder section options (such as the UMD Libraries Layout section). The Component Layout is a component placed inside a section to arrange its child components into columns.

Component Structure

Props

Field Data Type Requirement Description Note
Columns String Optional The number of equal-width columns to display. Options: 1, 2, 3, 4.
Component ID String Optional An ID for the component, useful for in-page anchor linking.

Slots

Field Data Type Requirement Description
Components Components Required The components to arrange in the column grid. Each top-level component placed here becomes one column item.

Usage Notes

  • Use 2 or 3 columns for Card components to create a card grid.
  • Avoid placing overly wide components (such as Table or Hero) inside a multi-column layout.
  • On small screens, columns stack vertically.

Clone this wiki locally