Panels

Panel Grid

Use .panel-grid in place of .panel-body when a panel's content should be split into bordered cells — for example a summary column next to label/value rows. Always pair .panel-grid with a column modifier.

Classes

Class	Description
.panel-grid	Grid container. Replaces .panel-body inside a .panel.
.panel-grid-1 … .panel-grid-6	Equal-width column count (1–6). Pair one with .panel-grid.
.panel-grid-30-70, .panel-grid-40-60, .panel-grid-60-40, .panel-grid-70-30	Two columns at a fixed ratio.
.panel-grid-aside	Two columns with a narrow first column, for a summary/aside next to detail rows.
.panel-grid-divided	Adds vertical borders between columns.
.panel-grid-inset	Insets the cell dividers from the grid edges.
.panel-grid-cell	A single cell. The first row has no top border.
.panel-grid-cell.panel-grid-header	A gray header cell.
.panel-grid.panel-grid-cell	A nested .panel-grid that acts as a flush cell of a parent grid.