---
title: "column-group"
description: "Group related object-table columns under one heading."
permalink: /docs/runtime/all-ui-components/object-table/column-group/
---
# column-group

<RuntimeVersion since="4.70.0" />

## Overview

Columns in an `object-table` can be grouped to indicate categories or cater for more sophisticated use cases.

<Info>

See more information in the guide on `object-table` [column groups](/docs/runtime/all-ui-components/object-table/object-table-guides/column-groups/).

</Info>

### Basic Example

```xml
<object-table ...>
    <column-group heading="Group 1">
        <column heading="Column 1">{col1}</column>
        <column heading="Column 2">{col2}</column>
    </column-group>

    <column-group heading="Group 2">
        <column heading="Column 3">{col3}</column>
        <column heading="Column 4">{col4}</column>
    </column-group>
</object-table>
```

![](./media/spaces-2f9tchlr67elhbojpvhhud-2fuploads-2fgit-blob-8523b981ed031205600d4c15affe9aa90aeeb30a-2fobject-table-column-group-basic-23cb7a22.png)

## Standard Attributes

### `heading`

<SyntaxCard type={"string"} defaultValue="unset" />

Text to appear in the header position of the `column-group`.

## Advanced Attributes

### `collapsed`

<SyntaxCard type={"boolean"} defaultValue="false" />

Use the `collapsed` attribute to put an entire group into a collapsed or expanded state. Unlike `show-if` and `hide-if`, column groups will remain visible but are represented as a vertical bar in-place of the group itself.

### `show-if`

<AttributeReference label="show-if" href="/docs/runtime/common-component-attributes/show-if/" badge="advanced" tone="muted" />

### `hide-if`

<AttributeReference label="hide-if" href="/docs/runtime/common-component-attributes/hide-if/" badge="advanced" tone="muted" />
